SuperAPI AI 工具集

shopify-checkout-extensions

通用与其它

查看项目

更新于 10-16 05:47

技能介绍

用途:在 Shopify 结账页添加自定义 UI 块,并用 Shopify Functions 自定义折扣、运费、支付方式与订单校验逻辑,替代已弃用的 checkout.liquid。UI 扩展适用于 Plus 与非 Plus 店铺,部分 Functions 目标仅限 Plus。

主要能力:结账 UI 扩展基于 @shopify/ui-extensions-react/checkout 的类 React 组件 API,可读取购物车行、修改购物车、读写 metafield、读取商家设置;Functions 编译为 WebAssembly,支持 Rust 或 JavaScript,可返回折扣、隐藏或重命名支付方式等结果。

使用方式:在已有 Shopify 应用目录中运行 shopify app generate extension,选择 Checkout UI extension 或 Shopify Function;在 shopify.extension.toml 中配置 api_version、target 与 settings;本地用 shopify app dev 预览 UI 扩展,用 shopify app deploy 部署。部署后在 Admin → Checkout → Customize 添加 UI 块,在 Admin → Discounts 激活 Function 折扣。

适用场景:结账追加销售、礼品留言字段、分层折扣、B2B 定价、按购物车内容过滤或重命名运费方式、按客户隐藏支付方式、下单前数量与地区校验。

限制:Function 执行需在 5ms 内,避免网络调用;UI 扩展运行在无 DOM 的 Worker 沙箱,不能使用浏览器 API 或原生 HTML;本地预览仅支持 UI 扩展,Functions 需部署后测试;设置字段的 handle 需与 useSettings() 的 key 一致。资料未提供具体收费与价格信息。