Shopify集成指南 | Retraced Help Center

Shopify集成指南：从安装到最终设置。

Shopify是一家网络商店服务提供商。将Shopify连接到我们的平台非常容易，因为retraced和Shopify都有一个简单的API来连接。

先决条件

必须有一个产品（在商店中公开可用），其SKU链接到平台上的供应链，并激活产品故事。

需要提供以下信息：

Shopify商店网址，类似于mybrand，shopify.com
实体店网址，比如mybrand.com

然后，将这些 URLs列入白名单，因为只有授权的网站才能从API请求信息。

安装

创建一个助手文件

在主题代码中，在snippets文件夹中创建一个名为retraced .liquid的文件。输入如下：

<script name="retraced-tag">
window.retraced = {
initialSku: "",
shop: "",
locale: "{{ shop.locale }}" || (window.navigator ? window.navigator.language : "en"),
variants: []
};

{% if product %}
window.retraced.variants = {{product.variants | json}};
window.retraced.initialSku = "{{ product.selected_or_first_available_variant.sku }}";
{% endif %}

{% if shop %}
window.retraced.shop = "{{shop.permanent_domain}}";
{% endif %}
</script>
<script async type="text/javascript" src="https://rtcd.me/shop-components.js"></script>

将include添加到主题中

打开theme.liquid,在</head>标签前的位置加上：

{% include 'retraced' %}

在任何地方添加组件

这取决于主题。只要在DOM的任何位置放置一个或多个或所有组件。通常，这可以是product.liquid:

<retraced-cards></retraced-cards>

Or use any other (or multiple or all!):
<retraced-icons></retraced-icons>
<retraced-button-verified></retraced-button-verified>

就这样

查看我们的小部件放置指南商店小部件放置指南 | Retraced Help Center，为retraced的小部件和商店组件确定首选位置