跳转到内容
免费安装
简体中文
在 Claude 中打开 就此页面提问在 ChatGPT 中打开 就此页面提问

创建购物车倒计时

从文案和时长到上线的购物车页面,完整构建购物车计时器。

本指南将构建一个完整的购物车倒计时:包含运行中计时器的文案、时长、样式,以及倒计时结束时的操作。

开始前,请确保应用嵌入已开启。

  1. 在仪表板或 Countdowns 页面中点击 Create countdown。

  2. 在 Countdown templates 页面中,将类型标签页切换为 Cart countdown,然后在默认布局上点击 Select。

  3. 例如“购物车保留 - 10 分钟”。

  4. 在 Settings 标签页中打开 Content,编辑 Message。新的购物车倒计时默认内容为:

    🔥 Hurry up! Your cart will be lost in {timer} !!

    {timer} 会被替换为运行中的时钟。请保留在句子中,没有它就没有倒计时,只剩一句警告。

    购物车倒计时的 Message 字段,文字中包含 timer 变量

    {timer} 会在您的文案中显示运行中的时钟。

  5. 仍在 Content 中,以分钟为单位设置 Countdown duration。默认值为 10。

    时间要足够让买家完成结账而不觉得被催促,又要足够短才有效果。大多数商店设置在 10 到 20 分钟之间。

  6. 使用 Settings 标签页中的设计控件来设置位置、文案、计时器和背景的颜色、边框以及字体。购物车倒计时没有单独的 Design 标签页,相关选项都在这里。

    文案位于购物车顶部,因此最好让它在视觉上比结账按钮更低调。

  7. 切换到 Display 标签页。对于购物车倒计时,此标签页包含 Action after time expired:

    • Go to the homepage without clearing cart:默认选项
    • Hide the message and do nothing
    • Clear the cart and redirect to:带有 URL 字段

    请谨慎选择:其中一项会删除买家的购物车。选择前请参阅 购物车计时器到期时。

    购物车倒计时 Display 标签页上的 Action after time expired 选项

    购物车倒计时的 Display 标签页包含到期操作。

  8. Conditions 部分仍然适用,例如您可以按客户、语言或国家/地区限制购物车倒计时。保持原样则在每个购物车中显示计时器。请参阅 显示条件。

  9. 将状态设置为 Active,然后点击 Save。

  10. 在您的线上店面中将商品加入购物车,然后打开购物车页面。计时器应位于顶部,并从您设置的时长开始倒数。

    如果您的模板有购物车抽屉,也请打开查看,倒计时同样会显示在其中。

    然后检查空购物车的情况:移除购物车中的所有商品。没有商品时,倒计时不会显示,这是正常的。

  11. 在无痕浏览器窗口中让计时器完整倒数一遍,确认到期操作符合您的预期,尤其是在您选择了 Clear the cart and redirect to 的情况下。在这里发现意外,比在支持工单里发现要好得多。

这对您有帮助吗?