如何设置库存形式的背面

预计阅读 7 分钟 | 更新于 2026年4月21日 9:56 AM EST

了解如何为您的在线商店设置和自定义库存注册表。使用 Klaviyo 的表单编辑器，您可以自定义网站上的产品缺货时出现的“通知我”按钮，以及客户用于通过电子邮件或短信注册缺货通知的表单。

开始之前

退货表格仅适用于 Shopify 和 BigCommerce。如果您使用其他平台，请参阅我们的返回库存流安装指南。在本文中，您将学习如何：

  • 从您的 Shopify 或 BigCommerce 商店中删除任何现有的 Klaviyo 返回库存代码（如果适用）
  • 启用和自定义您的退货按钮和注册表单

后台库存形式如何在店面发挥作用

发布缺货表单后，Klaviyo 会自动在库存缺货的任何产品页面上显示可自定义的“通知我”按钮。您可以在表单编辑器中自定义此按钮以及表单本身。该按钮根据您的产品库存自动出现和消失。当购物者点击“通知我”按钮时，您的表单就会出现，允许他们选择产品再次有货时如何收到通知，具体取决于您配置表单的方式：

  • 电子邮件：如果您包含电子邮件字段，购物者可以输入他们的电子邮件地址以通过电子邮件接收补货提醒。您还可以添加一个可选复选框，供购物者选择接收促销营销电子邮件。 – 短信：如果您包含电话号码字段，购物者可以输入电话号码以通过短信接收补货提醒。为了接收这些短信提醒，购物者必须明确同意接收促销短信。此同意是必需的且不能是可选的，并且您的披露语言必须存在。购物者提交表单后，Klaviyo 会在其个人资料上记录 订阅 Back In Stockk 事件。此事件用于触发您的库存回流。订阅的购物者将自动进入流程，并在产品补货时收到通知。请注意，库存表单不支持 A/B 测试和非传统短信选择加入方法（例如智能选择加入和点击文本）。

删除现有的 back in stock 代码片段

如果您之前安装了 Klaviyo 的 back in stock 代码片段，则必须首先将其删除以防止重复的按钮或表单。单击下面的箭头之一展开下面的部分，获取有关从商店平台删除代码的说明。如果您不确定要删除哪个脚本或代码，请联系您的开发人员或参阅原始安装说明。如果您之前没有添加过任何库存代码，请跳至下一部分，了解如何创建库存形式的库存。 *从 Shopify 网站删除 back in stock 代码在 Shopify 管理员中，转到在线商店 > 主题。在已发布的主题旁边，单击附加选项菜单（3 个点），然后选择编辑代码。打开 theme.liquid 文件。使用查找快捷方式（Mac 上的 Command+F 或 Windows 上的 Control+F）在文件中搜索单词“backinstock”。查找并删除以下代码片段：<script src=”https://a.klaviyo.com/media/js/onsite/onsite.js”></script&gt; <脚本> var klaviyo = klaviyo || []； klaviyo.init({ 帐户：“PUBLIC\_API\_KEY”， 平台：“shopify” }); klaviyo.enable(“backinstock”,{ 触发器：{ 产品\_page\_text：“有货时通知我”， 产品\_page\_class: “按钮”, 产品\_page\_text\_align: “center”, 产品页边距：“0px”， 替换\_anchor: false }, 模态：{ 标题：“{产品\_名称}”， body\_content: “注册以在该商品有货时收到通知。”, 电子邮件\_field\_label: “电子邮件”, Button\_label: “可用时通知我”, 订阅\_success\_label：“你加入了！ 恢复后我们会通知您。”, 页脚\_内容：”， 附加\_样式：“@import url(‘https://fonts.googleapis.com/css?family=Helvetica+Neue&#8217;);”， drop\_background\_color: “#000”, 背景\_颜色: “#fff”, 文本\_颜色：“#222”， 按钮\_text\_color: “#fff”, 按钮\_背景\_颜色: “#439fdb”, 关闭\_button\_color: “#ccc”, 错误\_背景\_颜色：“#fcd6d7”， 错误\_text\_color: “#C72E2F”, 成功\_background\_color: “#d3efcd”, 成功\_text\_color: “#1B9500” } }); </script>单击“保存”。返回您的网站并刷新缺货商品的产品页面。验证“通知我”按钮不再可见。

从 BigCommerce 网站重新删除库存代码

  1. 在您的 BigCommerce 后台中，转至 Storefront > 脚本管理器。
  2. 查找与 Klaviyo 退货功能相关的任何脚本。这些脚本的名称可能类似于“Klaviyo Back in Stock”，或者根据您之前的安装进行标记。
  3. 在脚本旁边，单击附加选项（3 个点）菜单，然后选择删除 以删除脚本。如果您最初将 Klaviyo 直接粘贴回库存代码到主题文件中（例如，在 footer.html 中），则必须从那里手动删除代码。为此，请转至 Storefront > 主题 > 编辑主题文件，找到包含脚本的文件，然后删除代码片段。
  4. 保存您的更改。
  5. 返回您的网站并刷新缺货商品的产品页面。验证“通知我”按钮不再可见。

创建库存表单

您的帐户中一次只能保留一份库存形式，无论是已发布还是处于草稿模式。如果库存表单已存在，则必须在创建新表单之前将其删除。

  1. 在 Klaviyo 的主导航中，选择注册表单选项卡。
  2. 单击创建表单。
  3. 在搜索栏中，输入“back in stock”并选择预构建的 Back in Stock 模板进行自定义。
在“创建表单”页面上显示三个“回到库存”弹出表单模板以供选择。
在“创建表单”页面上显示三个“回到库存”弹出表单模板以供选择。
  • 如果您希望从空白表单开始，请单击构建空白表单，然后选择返回库存作为表单类型。
  1. 选择您想要收集电子邮件和短信注册的列表。
  2. 单击创建表单。
回到库存多步骤弹出表单设置屏幕，其中包含电子邮件和短信订户列表选项。
回到库存多步骤弹出表单设置屏幕，其中包含电子邮件和短信订户列表选项。
  1. 选择菜单栏中的产品显示按钮步骤。请注意，这必须始终是表单的第一步，并且不能删除。
  2. 在左侧的编辑菜单中，选择按钮应显示在产品页面上的位置：
  • 替换“添加到购物车”按钮：“通知我”按钮将取代缺货商品的“添加到购物车”按钮。 – 堆叠：“通知我”按钮将出现在“添加到购物车”按钮下方（当显示为“已售完”时）。！产品显示按钮设置，包含替换或堆叠选项

如果您想将“通知我”按钮放置在其他位置，请参阅下面有关使用“klaviyo-bis-trigger”进行自定义按钮放置的部分。

  1. 使用文本、按钮样式、边框和投影选项来更新“通知我”按钮的标签和样式。
  2. 切换到电子邮件选择加入步骤，并使用样式菜单调整颜色、字体和布局，以便您的表单与您的品牌相匹配。
返回 Stock 表单编辑器，显示样式自定义选项和电子邮件选择加入弹出窗口的预览。
返回 Stock 表单编辑器，显示样式自定义选项和电子邮件选择加入弹出窗口的预览。
  1. 通过单击菜单栏中的每个步骤并重复步骤 9，将样式应用到表单中的每个后续步骤，例如 SMS 选择加入或成功步骤。每个输入步骤必须包含至少 1 个电子邮件或 SMS 输入字段。如果某个步骤同时具有这两个输入，则可以删除 1 个。如果某个步骤只有 2 个输入中的 1 个，则无法从该步骤中删除它。但是，如果您只想收集 1 个通道，则可以删除整个步骤。电子邮件营销同意是可选的，并且可以删除。
  2. 仅限 Shopify（可选）：要控制“通知我”按钮的显示位置，请转至定位和行为 > 定位，然后使用 Shopify 标签 来包含或排除应显示该按钮的特定产品。
BiS12.jpg
BiS12.jpg
  1. 当您对表单感到满意时，单击发布将其设置为生效。一旦您的表单生效，当您网站上的商品缺货时，您的产品显示按钮将自动出现。
  2. 发布后，您将在发布确认模式中看到一条提示，以设置您的库存流程。 – 如果您已经设置了以订阅库存补货指标作为触发器的库存补货流程，它将自动开始使用您的新库存补货表单。您不需要创建另一个；单击关闭。 – 如果没有，请单击退出并创建流程，然后前往我们的指南如何设置库存回流。
带有消息的模态
带有消息的模态

退货表格分析

您可以在其分析页面上监控库存表单的指标，包括库存提交和营销选择。请注意，提交率是根据库存订阅数量计算的，而不是根据营销同意数计算的。

分析仪表板显示提交率、库存提交、营销选择加入和查看的表单指标。
分析仪表板显示提交率、库存提交、营销选择加入和查看的表单指标。

此页面还包括按步骤和数据收集类型列出的表单数据图表：

  • 参与：这是指补货订阅（例如，当购物者注册电子邮件补货提醒时）。 – 营销选择加入：这是指购物者通过检查营销电子邮件选择加入框或提交电话号码来同意接收促销信息，因为短信提醒始终需要促销短信同意。

故障排除返回库存

如果您的补货体验未按预期运行，请查看以下常见问题。

“通知我”按钮未出现或位置不正确

如果您的产品页面中缺少“通知我”按钮，或者您希望将其配置为显示在不同的自定义位置，您可以使用“klaviyo-bis-trigger” HTML 属性手动控制其位置。 ““ <a class=”klaviyo-bis-trigger” href=”#”>可用时通知我</a>


将此属性添加到您想要呈现“通知我”按钮的特定 HTML 元素，然后 Klaviyo 将在该位置而不是默认位置显示该按钮。如果您使用自定义或非标准主题，此解决方案可能会很有帮助；但是，它并不总能解决缺少按钮的问题。如果您在配置自定义按钮位置时遇到问题，请咨询您的开发人员。

### 与 Shopify 的“缺货时继续销售”设置兼容

Klaviyo 的补货功能不适用于 Shopify 的“缺货时继续销售”设置。如果启用此设置，即使库存为零，产品也始终显示可用。结果：

- “通知我”按钮和返回库存形式将不会出现。 - 不会发送库存补货电子邮件，因为 Klaviyo 无法检测库存何时重新进货以触发流程。要使用 Klaviyo 的补货功能，请确保对这些产品禁用“缺货时继续销售”。

### 您使用的是 Retina 主题吗？ Retina 主题（来自 Out of the Sandbox）在产品页面中内置了“通知我”表单。您需要禁用主题附带的默认按钮才能使 Klaviyo 代码正常运行。

### 如果所有变体都已售完，您是否使用隐藏产品的主题？如果您的 Shopify 主题在所有变体均已售完时隐藏产品，则您需要在 Product.liquid 文件中识别代码的此区域，并对其进行编辑以显示所有产品，无论库存水平如何。