在线商店小组件
有三个区块可以在产品页面上绘制您的档位优惠：Quantity Break Table、 Quantity Break Picker 和 Spend More Save More 表格。您只需在主题中放置它们一次； 此后它们会跟随折扣，展示它的档位，并在优惠结束时隐藏。
-
在折扣中打开 Show on storefront。
打开该折扣 — 数量折扣、多买多省 或价格表 — 并打开 Show on storefront。对于新建的数量折扣和新建的多买多省折扣，它默认就是打开的。 卡片上的状态行会准确告诉您买家将得到什么，或者这个小组件为什么保持隐藏。
-
点击您想要的区块旁边的 Add。
该卡片底部的 Add to your theme 面板会按主题编辑器中完全相同的名称列出每一个区块， 并附上一行关于它是什么的说明，以及一个 Add 按钮，点击后会打开您的主题编辑器， 并把该区块准备好供您放置。
-
在主题编辑器中放置该区块并保存。
把这个区块放到产品页面上它该在的位置 — 通常在价格或购买按钮附近 — 然后点击 Save。
-
在主题编辑器中调整该区块的设置。
下面的每一个标签、颜色和行为，都是该区块本身在主题编辑器中的一个设置。
Quantity Break Table
Section titled “Quantity Break Table”把一个数量折扣优惠的每一个档位以表格形式列在产品页面上：数量、买家得到什么，以及价格。
General
Section titled “General”- Border color — 表格的边框。默认
#d9d9d9。 - Roundness — 圆角半径，0–24 px。默认 8。
- Borderless — 默认关闭。打开后会去掉边框。
Header
Section titled “Header”- Header background — 留空则使用设计默认值。
- Header text — 表头的文字颜色。
- Cell padding — 4–32 px。默认 14。
- Body background
- Body text
- Highlight unlocked tier — 默认打开。会高亮与所选数量匹配的那一行。
- Highlight color — 默认
#e8f5e9。
Columns
Section titled “Columns”- Display quantities as range — 默认关闭。打开后显示 “2–4” 而不是 “2+”。
- Quantity label template — 例如
Buy {quantity}+；{quantity}会被自动替换。留空则保持 “2+“。区间显示不受影响。 - Quantity label — 默认 “Buy”。
- Show savings column — 默认打开。对于按金额减免的优惠始终显示。
- Savings label — 默认 “Get”。
- Off-each label — 默认 “off each”。用于百分比优惠。
- Amount-off label — 默认 “off”。用于按金额减免的优惠；该金额是符合条件商品的合计金额， 因此这个默认值表述的是一个合计说法，绝不是每件的说法。
- Fixed-price label — 默认 “each”。用于固定价格优惠。
- Show prices column — 默认打开。对于按金额减免的优惠，以及变体超过 50 个的产品， 会自动隐藏。
- Price label — 默认 “Price”。
- Show original price — 默认打开。在每个折后价旁边把全价划掉。
- Show base row — 默认打开。为低于第一个档位的数量添加一行全价。
Message
Section titled “Message”- Code hint prefix — 默认 “Use code”。只对折扣码折扣显示。
- Linked message — 可选文字，显示在表格上方或下方。
- Message position — Above 或 Below。默认 Below。
Quantity Break Picker
Section titled “Quantity Break Picker”把同一个优惠做成可点按的优惠卡片，买家从中挑选，并一次性加入购物车。
General
Section titled “General”- Heading — 默认 “Choose your bundle”。
- Card border — 默认
#d9d9d9。 - Selected accent — 被选中卡片的边框和单选按钮颜色。
- Roundness — 0–24 px。默认 8。
- Card padding — 4–32 px。默认 14。
- Card background
- Card text
- Show single-item card — 默认打开。会在各档位上方添加一张 “Buy 1” 卡片。
- Single-item label — 默认 “Buy 1”。
- Pre-selected tier — 0–10。默认 0，即保持默认选中项。它只统计实际显示出来的档位， 因此隐藏的档位永远不会被预先选中。
- Tier label — 默认
Buy {quantity}；{quantity}会被自动替换。 - Off-each label — 默认 “off each”。用于百分比优惠。
- Amount-off label — 默认 “off”。用于按金额减免的优惠，表述的是合计说法。
- Fixed-price label — 默认 “each”。用于固定价格优惠（每件价格）。
- Per-product suffix — 默认 “of the same product”。在优惠按产品计数时显示。
- Per-variant suffix — 默认 “of the same variant”。在优惠按变体计数时显示。
- Show unit prices — 默认打开。对于按金额减免的优惠，以及变体超过 50 个的产品， 会自动隐藏。
- Show original price — 默认打开。在每个折后价上方把全价划掉。
- Each label — 默认 “each”。
- Most popular tier — 0–10。默认 0 表示不加标记；1 表示第一个档位。
- Most popular text — 默认 “Most popular”。
- Most popular background — 默认
#1a1a1a。 - Most popular text color — 默认
#ffffff。
Button
Section titled “Button”- Button text — 默认 “Add to cart”。
- Added text — 默认 “Added!”。
- Unavailable text — 默认 “Unavailable”。
- After adding to cart — Go to the cart page（默认）、Refresh the page（好让 主题显示新的购物车数量）或 Stay on this page（显示一条带有购物车链接的确认信息）。
- In-cart text — 默认
{count} in cart。在添加之后留在当前页面时显示；{count}是购物车中已添加商品的件数。 - Cart link text — 默认 “View cart”。
- Button background — 默认
#1a1a1a。 - Button text color — 默认
#ffffff。
Message
Section titled “Message”- Code hint prefix — 默认 “Use code”。只对折扣码折扣显示。
- Linked message — 可选文字，显示在这些卡片上方或下方。
Bundle composer
Section titled “Bundle composer”- Let shoppers mix variants per tier — 默认关闭。打开后，被选中的档位会为每一件商品 显示一行，让买家自行搭配这个组合。对于按变体的优惠不显示。
- Bundle button text — 默认 “Add bundle”。
- Items word — 默认 “items”。在无法显示金额合计时使用：“Add bundle • 3 items”。
- Unresolved text — 默认 “Choose options”。
- Message position — Above 或 Below。默认 Below。
Spend More Save More
Section titled “Spend More Save More”把一个多买多省优惠的每一个消费金额档位列在产品页面上：消费这么多，就能省这么多。
General
Section titled “General”- Border color — 默认
#d9d9d9。 - Roundness — 0–24 px。默认 8。
- Borderless — 默认关闭。
Header
Section titled “Header”- Header background — 留空则使用设计默认值。
- Header text
- Cell padding — 4–32 px。默认 14。
- Body background
- Body text
- Highlight unlocked tier — 默认打开。会高亮购物车已达到的最高档位。
- Highlight color — 默认
#e8f5e9。
Columns
Section titled “Columns”- Spend label — 默认 “Spend”。
- Savings label — 默认 “Get”。
- Off-the-order label — 默认 “off the order”。
- Off eligible items label — 默认 “off eligible items”。当折扣排除了部分商品时， 会用它来取代 off-the-order 标签。
Message
Section titled “Message”- Code hint prefix — 默认 “Use code”。只对折扣码折扣显示。
- Linked message — 可选文字，显示在表格上方或下方。
- Message position — Above 或 Below。默认 Below。
自定义主题选择器
Section titled “自定义主题选择器”Sale Badge 和 Price Drop 会自动在您的主题中找到自己的位置。在自动方式行不通的主题上， Promotions 页面上的 Theme selectors 会打开一个弹窗，其中有三个可选的 CSS 选择器， 用来让应用指向您主题自己的元素：
- Badge container in product cards — 每张产品卡片中用来固定徽章的那个元素。 填一次就能覆盖所有会显示产品卡片的页面。
- Price element on the product page — 产品页面上承载价格的那个元素，折后价会显示在那里。
- Price element in product cards — 每张产品卡片内部承载价格的那个元素。
留空某个字段则保持自动放置。每个选择器最多 200 个字符，且必须是有效的 CSS 选择器 — 如果不是，字段会就地这样提示。匹配不到任何内容的选择器会回退到自动放置， 而一个不含价格的选择器则什么都不画，而不是去划掉一个错误的数字。
买家看到的效果
Section titled “买家看到的效果”每个区块都会在产品页面上您放置它的位置渲染，并显示该优惠真实的档位。 Quantity Break Picker 还可以加入购物车。当这个优惠并不覆盖买家眼前的这个产品，或者优惠已暂停或已结束时， 区块会什么都不显示，而不是给出一个过时的说法。
- **每个产品一个小组件。**当两个已开启展示的优惠覆盖同一个产品时，那里只会显示一个小组件。 折扣的 Show on storefront 卡片会统计它们，并提供 Choose which one shows。每一个折扣仍然按照它自己的条件生效。
- **变体超过 50 个时隐藏价格。**对于按金额减免的优惠，以及变体超过 50 个的产品， 价格列和 Quantity Break Picker 中的单件价格会被自动隐藏。
- 暂停这个优惠会隐藏小组件 — 此时卡片会显示 “Not shown (offer paused)”， 并且不再提供那个开关，因此一个已暂停的优惠永远不会看起来像是在运行。
- **这个展示开关只影响展示。**关闭 Show on storefront 会隐藏小组件； 折扣照常生效。若要停止折扣，请暂停这个优惠。
- 主题选择器是店铺级别的，不是按促销展示设置：保存它们会改变店铺上每一个 Sale Badge 和 Price Drop 的放置位置。