> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.rto.ai/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How ConvboxTracking works with a headless Shopify

大多数在 Shopify 应用商店中提供的用户行为跟踪产品不适用于 headless 设置。为了解决这一问题，Convbox 提供了一种专为 headless 电商设计的开箱即用解决方案。这是一种低代码（几乎无需编码）的方法。只需几分钟，您就可以部署一套最佳实践的用户事件跟踪和营销效果分析解决方案。

![](https://storage.crisp.chat/users/helpdesk/website/bf925fddbcd2e800/image_5gme35.png)

ConvboxTracking (Omnitrack) 的服务器端和浏览器端跟踪完全兼容 headless 店面。如果您使用 Shopify 作为核心电子商务平台，但不使用 Liquid 模板，您可以使用我们的开箱即用解决方案来简化事件跟踪。该解决方案包括两个主要组件：

1. 用于处理前端（浏览器事件）的 JS-SDK；
2. Omnitrack（ConvboxTracking）应用程序，可以 **同时跟踪结账步骤和购买事件** 。

### 支持的 headless 框架
目前，Convbox 支持以下框架，且这些框架已通过测试：
* Shopify Hydrogen
* NextJS
* GatsbyJS
我们将不断增加支持的框架列表。您也可以向我们建议您正在使用的框架。

### 工作原理
Convbox 的跟踪系统能够在 headless 店铺中运行，因为我们的应用程序通过 Webhooks 接收购物车更新、结账更新和订单创建信息，即使跟踪脚本不在结账页面或感谢页面上，也能触发 Facebook、TikTok、Snapchat、Pinterest 等平台的事件。

为了实现这些功能，您的开发人员需要将我们的 SDK 代码嵌入到您的店面代码中。这将允许我们跟踪页面浏览（pageView）、内容查看（viewContent）、搜索（search）、添加到购物车（addToCart）等事件。此外，我们的应用程序会自动将用户的预结账行为与 Shopify 的 Webhooks 数据链接。

### 使用 Shopify Checkout 用作购物车（用来持久化购物车内容）
如果您使用 Shopify Checkout 用来持久化购物车内容，请与我们联系。特别是，如果您将 Shopify Checkout 用作购物车，那么“加入购物车”操作可能会在您的分析数据中记录为“结账开始”事件。这是由于 ConvboxTracking (Omnitrack) 处理结账跟踪的机制所致。

### 下一步
请按照 headless 店铺的 [安装说明](/zh/article/convbox-for-headless-ecommerce-1y91uyd/) 进行操作。