在页面构建器中使用 Bundlex（GemPages、PageFly、Shogun）
如果你的产品页面使用 GemPages、PageFly 或 Shogun 等页面构建器创建，请使用锚点代码片段来选择 Bundlex 小组件的显示位置。将其粘贴到产品页面的自定义 HTML 区块中。如果小组件完全没有显示，还请检查应用嵌入、已发布的组合和产品表单；锚点仅控制显示位置。
为什么页面构建器需要锚点
通常，小组件会检测你的产品表单，并将自身插入其容器之前。页面构建器可能会改变这种布局。锚点为小组件提供明确的渲染位置，但 Bundlex 仍需要找到产品的加购表单，才能将优惠关联到购买按钮。
获取代码片段
锚点是组合编辑器中可直接复制的代码片段。
- 在 Bundlex 控制面板中打开你想在页面构建器页面上显示的组合。
- 打开 高级选项卡。
- 找到 正在使用页面构建器？选项，然后点击将其展开。
- 点击 复制，将代码片段复制到剪贴板。
代码片段始终相同：
<div data-bundlex-widget></div>
将其粘贴到页面构建器中
- 在页面构建器的编辑器中打开产品页面（GemPages、PageFly、Shogun 或其他构建器）。
- 在你希望小组件显示的准确位置添加一个 自定义 HTML 或 代码区块，例如价格下方或加购按钮上方。
- 将代码片段粘贴到该区块中。
- 预览产品页面，确认小组件位于正确位置后保存并发布。
启用应用嵌入且没有匹配的自定义定位目标优先处理时，小组件会在第一个锚点内渲染。应用区块则会在其自身的区块位置渲染。请将锚点放在页面的产品区域内，并靠近购买控件。
一个代码片段适用于所有组合
你不需要为每个组合使用不同的代码片段。所有组合都使用完全相同的 <div data-bundlex-widget></div>。Bundlex 会根据页面所展示的产品决定要渲染哪个组合，因此锚点只控制小组件显示在哪里，而不会决定显示哪个组合。在每个需要显示它的页面构建器产品页面上粘贴一次即可。
仅将其放在相关页面区域
仅在你确实希望小组件显示的页面区域添加锚点。如果同一个代码片段同时出现在多个位置，例如购物车抽屉或重复加载产品标记的快速查看弹窗中，小组件会附加到页面上找到的第一个锚点。为确保位置可预测，请将代码片段放在单一且相关的位置，不要分散到多个模板中。
检查桌面端和手机端布局。有些构建器会在同一页面中保留独立的桌面端和移动端产品表单。指向隐藏副本的选择器或锚点可能在某个宽度下有效，但在另一个宽度下失效。如果出现这种情况，请联系支持团队检查两种布局。
粘贴后小组件没有移动
如果小组件没有移动到新位置：
- 确认你使用的是应用嵌入，而不是放置在其他位置的应用区块。嵌入中的匹配自定义定位选择器优先于锚点。
- 强制刷新店面页面：Cmd/Ctrl + Shift + R。这可以重新加载过期的浏览器资源，但不会发布草稿页面，也无法修复错误的选择器。
- 确认页面已发布，而不只是保存在页面构建器的编辑器中。
- 确保你准确粘贴了代码片段，周围没有多余字符。
如果小组件仍然完全没有显示
锚点只负责定位小组件。小组件仍需要满足以下常规加载条件：
- 使用锚点方式时，必须启用 Bundlex 应用嵌入。如果希望由区块控制位置，请使用应用区块。
- 必须有已发布的组合与该页面上的产品匹配。
- Bundlex 必须能够检测到正确的产品表单和加购按钮。
如果应用嵌入和匹配的折扣均已启用，请检查位置优先级和产品表单检测。如果锚点仍为空，请将产品 URL 提供给支持团队。
落地页有所不同
锚点代码片段仅适用于产品页面。如果你希望在常规 Shopify 页面（任何 /pages/ URL）上提供组合优惠，请添加主题中的 精选商品区段，并将 Bundlex Bundles featured区块放入其中。将该区块的商品设置为与该区段相同的商品，或保留其“区段商品”关联。该区段会提供购买表单；该区块无需锚点代码片段即可加载小组件。
检查结果
- 在桌面端和手机端宽度下打开实际已发布的产品 URL。
- 确认一个小组件显示在预期位置，并显示匹配的产品和优惠价格。
- 选择一项优惠并将其加入购物车。检查主产品、变体、数量以及任何已选的附加项。
- 继续结账，在下单前检查折扣和小计。如果只有页面构建器预览有效，请将已发布的产品 URL 发送给支持团队。
如需全面了解 Bundlex 如何选择显示位置，包括适用于落地页的精选产品区块、自定义定位选择器和主题应用区块，请参阅 小组件在产品页面上的显示位置。
这篇文章对您有帮助吗？
您的反馈有助于我们改进文档。