> ## Documentation Index
> Fetch the complete documentation index at: https://docs.aftersell.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 进度条与商品徽章

> 本文介绍进度条与商品徽章功能的工作方式。

你可以在**一键 upsell 编辑器**中找到这些功能，位于左侧边栏的 **Funnel-wide widgets** 分组下（该分组包含进度条和徽章 widget）：

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-upsell-editor-sidebar-funnel.gif?s=d42039add0fe9339dc962050863a57de" alt="Upsell 编辑器侧边栏，高亮显示 Funnel-wide widgets 中的进度条和新的徽章 widget" width="628" height="1080" data-path="images/aftersell/progress-bars-badges-upsell-editor-sidebar-funnel.gif" />

<div id="progress-bars">
  ## 进度条
</div>

**漏斗级** widget 允许你为一个 upsell 添加进度条，并自动应用到同一漏斗内的所有 upsell。这确保了各 offer 体验的一致性，同时减少了商家的手动设置。

* 该 widget 始终可用，但对现有 offer 和漏斗默认标记为隐藏。
* 对新创建的漏斗默认启用。
* 如果商家偏好自定义设计等，仍可通过**图片** widget 上传自定义进度条。

  * 目前这些 widget 无法翻译，因此你需要上传包含所需个性化翻译的自定义图片。翻译和更多选项即将推出！

<div id="settings">
  ### 设置
</div>

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-edit-bar-widget-panel.gif?s=7a5dc519652c75d2f4e777638fc69f5c" alt="Edit Progress Bar Widget 面板，包含样式、外观和内边距控制项，旁边是 offer 预览" width="3016" height="1080" data-path="images/aftersell/progress-bars-badges-edit-bar-widget-panel.gif" />

<div id="style">
  ### 样式
</div>

Minimal

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-minimal-style-milestones.gif?s=19441a6c6391cfd9a2a191e6507c1303" alt="Minimal 样式进度条，显示购物车、美元、礼品和对勾图标，无文字标签" width="3840" height="632" data-path="images/aftersell/progress-bars-badges-minimal-style-milestones.gif" />

Minimal with labels

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-minimal-with-labels.gif?s=ee539f91e8f8bad682ec8f152e2bfc6e" alt="Minimal with labels 进度条，显示 Cart、Order placed 和 Done 里程碑" width="3840" height="632" data-path="images/aftersell/progress-bars-badges-minimal-with-labels.gif" />

Maximal

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-maximal-style-milestones.gif?s=c480f2cb09be0ca53092012ef4e46357" alt="Maximal 样式进度条，带有购物车、美元、礼品和对勾里程碑图标" width="3840" height="632" data-path="images/aftersell/progress-bars-badges-maximal-style-milestones.gif" />

<div id="appearance">
  ### 外观
</div>

Black

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-black-appearance-preview.gif?s=a0e842d84eac6215cfb7846a08123309" alt="显示在 upsell offer 预览上方的黑色外观进度条" width="3840" height="788" data-path="images/aftersell/progress-bars-badges-black-appearance-preview.gif" />

White

<img src="https://mintcdn.com/aftersell/SnVX3h-PpMMxQMDU/images/aftersell/progress-bars-badges-white-appearance-preview.gif?s=d46a16dc9b27572e3542674cd4ed8983" alt="显示在 upsell offer 预览上方的白色外观进度条" width="3840" height="788" data-path="images/aftersell/progress-bars-badges-white-appearance-preview.gif" />

***

<div id="product-badges">
  ## 商品徽章
</div>

**商品徽章**让商家可以直接在 offer 上突出关键商品信息。这些徽章有助于吸引注意力到重要功能或优惠上，提升曝光度和买家信心。

* 作为每件商品的可选项提供。
* 商家可以上传自己的自定义徽章。
* 颜色、文字和图标目前无法编辑，但可自定义的模板即将推出。

<div id="settings-2">
  ### 设置
</div>

<div id="badge-labels-options">
  ## 徽章文字选项：
</div>

* **Bestseller**——适合突出销量最高或表现最强的商品，增强信任感和社会认同。
* **Trending**——适合展示当前热度上升或互动量高的商品。
* **New**——最适合吸引注意力到新上架的商品或 offer。
* **Lowest Price**——适合推广折扣或高性价比商品，促进快速转化。
* **Ships Free**——非常适合强调免运费优惠，减少购买犹豫。

<div id="appearance-options">
  ## 外观选项
</div>

徽章提供四种外观样式，以匹配不同的漏斗设计和品牌审美：

* **Vibrant**——明亮醒目，适合立即吸引注意力到关键 offer。
* **Vibrant Inverse**——Vibrant 的反色变体，对比更强烈。
* **Classic Dark**——简洁专业，最适合浅色背景。
* **Classic Light**——低调简约，适用于深色背景或更柔和的风格。

<div id="position-in-offer">
  ## 在 offer 中的位置
</div>

徽章可以放置在 offer 布局的不同位置，以最贴合你的设计，并将注意力引导到最有效的地方：

* **Above Product Title**——适合在购物者阅读商品详情前立即获得曝光。
* **Adjacent to Product Price**——适合在价格附近强化紧迫感或价值感。
* **Below Product Price**——最适合以不打扰的方式传递支持购买决策的信息。

***

<div id="why-it-matters">
  ## 为什么重要
</div>

在众多商家（包括使用 Smart Funnel 的商家）中，进度条在提升每访客收入（RPV）和转化率方面一直表现出积极效果。

同样，**商品徽章**在增强信任感和买家认知方面也被证明行之有效，为整体漏斗表现带来可衡量的提升。
