Skip to main content

概览

Upcart 允许你使用 Custom HTML 编辑器将 HTML 或 JavaScript 插入到购物车的特定位置。这让你可以完全控制购物车体验中的布局、可见性和条件内容。 使用本指南了解各个位置的行为以及你的内容将显示在哪里。

可用的 HTML 位置

Above announcements/rewards(公告/奖励上方)

直接渲染在购物车头部下方、所有模块之前。
可用于添加全站消息、标记或动态横幅。

Below header/announcements/rewards(头部/公告/奖励下方)

直接显示在 Announcements 和 Rewards 模块之后、产品列表之前。

Between each line item(每个行商品之间)

在购物车中每个产品之后重复显示你的 HTML。
非常适合展示免责声明或产品特定的附加信息。

Below cart items(购物车商品下方)

渲染在产品列表下方、所有购物车行商品之后。可用于放置应显示在产品之下、upsell 和附加项目之上的消息、横幅或自定义内容。

Above footer/add-ons(页脚/附加项目上方)

显示在产品列表和 upsell 下方,但在 Add-ons 部分之上。
非常适合放置引导至保修或运输保障优惠的消息。

Above checkout button(结账按钮上方)

显示在页脚区域内、结账按钮和小计的正上方。
常用于展示价格明细、运费通知或条款。

Below checkout button(结账按钮下方)

同样位于页脚,位置在结账按钮之后、快捷支付按钮之前。Add-ons 渲染在页脚顶部,远在此位置之上。
适用于次要 CTA 或法律声明。

Bottom of cart(购物车底部)

显示在页脚区域之外、cart drawer 的最底部。
不会继承页脚的背景颜色。

On empty cart screen(空购物车界面)

仅在购物车为空时显示。
直接显示在 “Your cart is empty” 消息下方、推荐模块上方——适合放置一行辅助文字或指向某个系列的链接。

Scripts (Before Load)(加载前脚本)

不可见的位置,用于在购物车加载之前运行 JavaScript。
可用于定义变量、设置条件或修改 Upcart 的行为。
  • 所有自定义 HTML 位置均在以下路径管理:
    Upcart > Cart Editor > Settings > Custom HTML

视觉参考

要清楚地了解每个位置在购物车中的渲染位置,请参考下方带标注的布局图
带标注的 Upcart cart drawer,显示每个自定义 HTML 位置的渲染位置