---
title: 如何在 Shopify 上安装代理
description: 了解如何在 Shopify 主题中插入代码、代理如何读取商店目录、购物车和支付的处理方式，以及如何验证安装。
section: platforms
keywords: Shopify, Shopify 小部件, theme.liquid, Shopify 聊天, AI 代理, Shopify 产品目录, Shopify 智能客服, Shopify 安装, Shopify 电子商务, Shopify 销售代理, Shopify 聊天机器人, Shopify 主题代码
updated: 2026-09-06
---
Shopify 已经拥有机器可读的商品目录，因此代理能够比其他任何地方更准确地收集商品信息：价格、变体、库存和图片都直接来自商店。

## 步骤 1. 将代码插入主题

1. 在 Shopify 管理后台，打开 **“在线商店” → “主题”**。
2. 在当前活动主题旁，点击 **… → “编辑代码”**。
3. 在文件列表中找到 `layout/theme.liquid`。
4. 将后台提供的代码行直接粘贴到 `</body>` 闭合标签之前。
5. 保存。

另一种无需修改主题的方法是：**“在线商店” → “偏好设置” → “自定义代码”**，或使用任何脚本插入应用。效果相同。

```liquid
    <!-- Commerce Agents -->
    <script src="https://comag.vibevox.pro/widget.js" data-slug="your-slug" async></script>
  </body>
</html>
```

请在后台点击“复制代码”按钮获取准确的代码行：其中已包含您商店的地址。

## 步骤 2. 收集商品目录

在设置中指定商店地址并启动分析。Shopify 爬虫会读取商品的结构化数据：名称、价格、货币、库存、描述和图片。变体（尺寸、颜色）会作为属性显示在商品卡片中。

重新分析会更新价格和库存。在商品种类发生重大变化后请运行此操作：代理不会直接连接到您的数据库，而是使用已收集的商品目录。

## 步骤 3. 将支付留在商店

在 Shopify 上，无需在聊天中启用支付。正确的流程是：

1. 在商店设置中指定购物车链接 — 通常是 `https://您的域名/cart`。
2. 代理会挑选商品，显示商品卡片，并通过按钮将顾客引导至 Shopify 购物车。
3. 结账和支付按常规方式进行，并遵循您所有的配送和税务规则。

为了查看哪些对话最终促成了购买，请将购买像素代码片段插入到感谢页面。在 Shopify 中，这位于 **“设置” → “结账” → “订单状态页面” → “附加脚本”**。包含订单号和金额替换的代码片段可在后台的“小部件和链接”部分找到。

## 商品加入购物车，对话不中断

在这一点上，Shopify 比其他平台表现更出色。代理会显示包含图片、价格和按钮的商品卡片，但该按钮不仅仅是跳转页面 — 它会将商品添加到商店购物车。

其工作原理是：Shopify 商品链接中包含变体标识符，代理通过标准接口 `/cart/add.js` 将其传递给您的购物车。页面不会重新加载，对话不会中断，顾客会看到一个简短的确认信息并继续选择。此时商品已在 Shopify 购物车中 — 并遵循您所有的折扣、税务和配送规则。

如果链接中没有变体，代理会打开商品卡片，顾客自行添加。这不会导致任何问题，只是多了一次点击。

当顾客准备好时，“前往结账”按钮会引导至 `/cart`，其中所有商品都已准备就绪。接下来是常规的 Shopify 结账流程。

另外关于上下文：代理会读取打开聊天页面的结构化数据。顾客查看特定商品并询问“有 L 码吗？” — 代理会理解其意图，无需再次询问。

- 在无痕模式下打开商店，等待聊天按钮出现。
- 按名称询问商品 — 应该会出现带有价格的商品卡片。
- 点击“前往结账” — 应该会打开 Shopify 购物车。
- 下一个测试订单，并确认购买已在“订单”中标记。

## 聊天风格与商店保持一致

Shopify 主题决定了整个商店的风格，聊天界面不应与其脱节。小部件设置中有三种选项：浅色、深色和“访客模式”，后者会根据顾客的设备设置而定。

对于深色主题的商店，请强制设置为深色；对于浅色主题的商店，则设置为浅色。在两种情况下，按钮的强调色都保持不变，由您决定。

## 步骤 4. 检查

## 常见问题

**更换主题后小部件消失。** 代码存在于主题文件中。更换或更新主题会清除修改 — 请重新插入代码，或使用不依赖主题的“自定义代码”。

**商品目录未完全收集。** 爬虫会从公开页面获取商品。目录中隐藏的商品和草稿不会被收录，这是正常的。

**商品目录中的价格已过时。** 请重新运行网站分析，它会根据现有商品卡片更新价格和库存。

**小部件与聊天应用冲突。** 请只保留一个聊天：同一角落的两个窗口会相互干扰并混淆顾客。

## 常见问题

### 是否需要 Shopify App Store 中的应用

不需要。代理通过一行代码连接，无需安装应用。

### 代理是否能显示商品变体

是的，变体会作为属性显示在商品卡片中：尺寸、颜色、容量。顾客在 Shopify 购物车中选择具体的变体。

### 如何处理多种货币

代理会以爬取时确定的商品目录货币显示价格。Shopify 的多货币功能在购物车和支付环节继续生效。

### 代理是否会知道库存情况

库存是在分析时获取的。对于经常售罄的商品，请更频繁地运行分析，或在条款中添加说明，指出库存情况将在结账时确认。

### 小部件是否会影响商店速度

脚本异步加载，不会阻塞渲染。这对 Core Web Vitals 指标几乎没有影响。