Shopify
为 Shopify 商品页加上虚拟试穿
今天就能在主题编辑器粘贴脚本，或按本仓库脚手架安装 Theme App Extension。试穿按钮默认悬浮在商品图上。商家在 tryonanytime.com 购买积分 — 我们不使用 Shopify Billing。
商品页只需一行
<!-- TryOnAnytime — get pk_ at https://tryonanytime.com/settings/embed --> <!-- Shopify Online Store 2.0 — 贴到 Custom Liquid（脚本可放任意位置；浮层模式会自动找到商品图） --> <!-- optional: float the button on the product image instead of in place --> <!-- data-tryon-attach="image" --> <!-- data-tryon-image=".product__media img, .wp-post-image" --> <!-- data-tryon-position="bottom-right" (bottom-left|top-right|top-left) --> <script src="https://tryonanytime.com/embed.js" data-tryon-key="pk_…" data-tryon-garment="https://your-shop.com/product.jpg" data-tryon-label="Try it on" data-tryon-attach="image" data-tryon-image=".product__media img, .woocommerce-product-gallery__image img" async></script>
状态: embed 脚本今天可用。Theme App Extension 脚手架在 packages/shopify-app — 尚未上架 Shopify App Store。
面向商家。想在任意网站试穿的消费者请用 Chrome 扩展。
积分在 tryonanytime.com（设置 → 积分 / 定价）购买。本集成不使用 Shopify Billing API，也不会从商家的 Shopify 账户扣款。
安装步骤
- 01
创建发布密钥
在 设置 → Embed 创建 pk_，并把 *.myshopify.com 与自定义域名加入白名单。
- 02
在 tryonanytime.com 购买积分
在 设置 → 积分 或 /pricing 充值。Shopify 不会为试穿向你收费。
- 03
粘贴片段或添加 App Block
主题编辑器 → 商品模板 → 添加 Try on 应用块（或 Custom Liquid）。默认悬浮在商品图上，也可在应用块的位置设置里改回原位。将 data-tryon-garment 指向商品图 URL。
- 04
预览并发布
打开商品页 — 按钮应悬浮在商品图的角上。点击试穿，确认域名白名单后发布主题。