跳转到内容
免费试用 14 天
简体中文
在 Claude 中打开 就此页面提问在 ChatGPT 中打开 就此页面提问

店面通知

选择应用的成功和错误提示在店面中的显示方式(提示条、弹窗或横幅),并自定义设计和颜色。

当客户将产品加入购物车、更改应用的购物车抽屉、结账或使用折扣码时,应用会在店面中显示一条简短的成功或错误提示。通过 Storefront notifications,您可以选择这些提示的外观。

共有三种样式:

  • Toast:屏幕角落的小提示。
  • Modal:屏幕中央带 OK 按钮的弹窗,客户关闭前会一直显示。
  • Banner:屏幕顶部或底部的横条。
  1. 在应用中,点击 Add-on Features,找到 Storefront notifications,然后点击 Customize。

  2. 在 Notification style 中选择 Default style:Toast、Modal 或 Banner。除非您在下一步为某项功能选择了其他样式,否则所有提示都使用此样式。

  3. 为各项功能分别选择样式(可选)

    Section titled “为各项功能分别选择样式(可选)”

    在 Style per feature 下,保持 Default,或为某一组提示选择其他样式:

    • Add to cart:由应用加入购物车的产品,包括来自产品页面、Quick Buy、Quick Order Form 或应用 Wholesale cart 抽屉的产品。
    • Cart updates:应用 Wholesale cart 抽屉中的更改,例如更新购物车,或保存、删除地址。
    • Checkout & Pay later:结账错误,以及 Pay later 订单的成功和错误提示。
    • Discount code:应用折扣码输入框的提示,例如折扣码被接受,或不适用于购物车中的商品。

    示例:将默认样式保持为 Toast,并为 Checkout & Pay later 选择 Modal,这样客户就不会错过 Pay later 的确认信息。

  4. 在各样式对应的部分设置其外观。颜色留空则使用默认外观。

    Toast 样式

    • Auto hide:默认开启。关闭后,每条提示会一直显示在屏幕上,直到客户关闭。
    • Design:Classic、Card、Soft 或 Pill。
    • Position:Top right、Top left、Bottom right 或 Bottom left。
    • Auto hide after:2 到 30 秒,默认为 5 秒。
    • Success background、Error background 和 Text color。

    Modal 样式

    • Design:Classic、Card 或 Dialog。
    • Button background 和 Button text:OK 按钮的颜色。
    • Corner radius:0 到 40 px。

    Banner 样式

    • Auto hide:默认开启。关闭后,横幅会一直显示,直到客户关闭。
    • Design:Classic、Soft 或 Floating。
    • Position:Top 或 Bottom。
    • Auto hide after:2 到 30 秒,默认为 5 秒。
    • Success background、Error background 和 Text color。
  5. 在 Preview 中选择 Preview template,然后点击 Show success 或 Show error,查看该样式配合您的设置后的效果。预览使用与您店面相同的模板。

    点击 Save。

  • 客户可以通过 OK、× 按钮、点击弹窗外部或按 Esc 键关闭 Modal。Modal 不会自动关闭。
  • 屏幕上最多同时显示五条 Toast。出现第六条时,最早的一条会被移除。
  • 同一时间只显示一个 Modal 和一个 Banner。新的提示会替换屏幕上已有的提示。
  • Pay later 订单成功并显示成功提示时,应用会清空购物车并重新加载页面。使用 Modal 时,页面会在客户关闭弹窗后重新加载,以便客户先阅读提示。使用 Toast 或 Banner 时,页面会在几秒后重新加载。
  • 提示文字的编辑方式与其他店面文字相同。请参阅编辑和翻译应用部分功能的内容。
  • 需要其他的通知显示方式?请点击 Notification style 部分中的 Contact support,我们的团队可以为您提供帮助。

如果您在操作这些步骤时遇到任何困难,请随时通过电子邮件 [email protected] 与我们联系。

这对您有帮助吗?