> For the complete documentation index, see [llms.txt](https://docs.bogos.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bogos.io/cn/detailed-guide/customize/customize-gift-slider.md).

# 自定义赠品滑动栏

自定义赠品滑动栏旨在帮助您调整赠品滑动栏的文本、颜色、布局和商品展示。该滑动栏会展示顾客符合条件时可获得的所有赠品商品，并在顾客满足优惠活动条件时显示。

{% embed url="<https://youtu.be/Qh_bjkchzpo>" %}

<figure><img src="/files/zB1E3lmX6Uxt1st0BouZ" alt=""><figcaption></figcaption></figure>

## 1. 自定义选项 <a href="#h.7t9zvvzdp0pq" id="h.7t9zvvzdp0pq"></a>

### 1.1. 通用 <a href="#h.3qozp25yjgx2" id="h.3qozp25yjgx2"></a>

**赠品展示方式：** 赠品展示方式让您控制免费赠品向顾客展示的方式。有两个主要选项供您选择。

* 按商品：将赠品显示为单个商品，各变体归类在每个商品下方。

<figure><img src="/files/QTg2iJLht2ylzv7Xs9CO" alt=""><figcaption></figcaption></figure>

* 按变体：将每个变体（如尺寸或颜色）显示为单独的赠品选项。

<figure><img src="/files/9RPpcgu9KV1zGT1Kltu9" alt=""><figcaption></figcaption></figure>

**分组**：分组控制在多个优惠活动同时生效时免费赠品的组织和展示方式。

* 按优惠活动显示赠品：赠品根据其所属的优惠活动分组，在同时运行多个促销时很有用。

<figure><img src="/files/uyx9yedwZL9HdNbwmoyh" alt=""><figcaption></figcaption></figure>

* 一次显示所有赠品：所有符合条件的赠品显示在同一列表中，便于快速浏览。

<figure><img src="/files/2RcBGWIMM0bhmLMBNda4" alt=""><figcaption></figcaption></figure>

**每行商品数**：调整每行显示的赠品数量，以确保布局整洁。

### 1.2. 高级 <a href="#h.4iowmdam2shk" id="h.4iowmdam2shk"></a>

<figure><img src="/files/o4kAYXJYFRvMItZkaYYT" alt=""><figcaption></figcaption></figure>

**商品展示**：此选项让您设置赠品商品的视觉呈现方式，帮助顾客更好地与赠品优惠活动互动。

* 显示商品标题：显示主商品名称。
* 显示变体标题：显示变体名称（例如尺寸、颜色）

**其他展示**：通过可选的展示增强功能提高清晰度和用户导航体验。

* 显示可添加的赠品数量：让顾客看到他们在该优惠活动中可以选择多少件赠品。
* 显示分页：当赠品数量较多时添加分页，保持展示整洁。

**关闭滑动栏开关**：此复选框让顾客可以暂时关闭滑动栏。设置持续时间（分钟）。

**允许添加多个赠品**：允许顾客选择多个赠品。

### 1.3. 页面展示 <a href="#h.xshwd5hzjfmm" id="h.xshwd5hzjfmm"></a>

<figure><img src="/files/IwCgUyW1gJalyJS3xfG4" alt=""><figcaption></figcaption></figure>

**在所有页面显示**：在您整个店铺网站上显示优惠活动小组件。

**在特定页面显示**：精确选择优惠活动的显示位置

* 首页
* 购物车页面
* 商品页面
* 分类页面
* 自定义页面

### 1.4. 文本 <a href="#h.fyb024kjj98l" id="h.fyb024kjj98l"></a>

<figure><img src="/files/7gFgqbvHnl3jpZtmrbcw" alt=""><figcaption></figcaption></figure>

* **赠品滑动栏标题**：这是显示在赠品滑动栏窗口顶部的标题。
* **加入购物车按钮**：加入购物车按钮的名称。
* **关闭滑动栏文本**：让顾客关闭赠品滑动栏并在几分钟内不再显示的复选框名称。

### 1.5. 颜色 <a href="#h.ajm0shjqjvk8" id="h.ajm0shjqjvk8"></a>

BOGOS 允许您通过以下 4 种方法之一来自定义所有元素的颜色：

* 从下拉菜单中选择一个**现成的配色方案**。
* **手动调整**所有可用颜色的每个颜色字段。
* 使用 [AI 主题检测器](#ai-theme-detector)根据您店铺的品牌风格自动生成完整的小组件配色方案。
* **联系 BOGOS 支持团队**以获得颜色自定义方面的帮助。

完成后点击**保存**。

#### AI 主题检测器

BOGOS AI 会扫描您的网店，检测您品牌的主色、辅色和文本颜色，然后自动生成完整的小组件配色方案。

{% hint style="warning" %}
您的店铺不得设置密码保护，以便 AI 能够访问并检测您的品牌颜色。
{% endhint %}

使用 BOGOS AI 编辑颜色：

1. 点击**铅笔图标**。

![](/files/8HMgW0p6Hvadbsq4mpf0)

2. 点击**重新扫描**让 BOGOS AI 重新检测，或**手动调整**主色、辅色或文本字段。

![](/files/wr4WVSAsv8yHcB3JKixf)

3. 点击**应用**以将颜色应用到小组件预览中进行预览。

### 1.6. 将赠品滑动栏嵌入商品页面 <a href="#h.bqt56rm4ft9m" id="h.bqt56rm4ft9m"></a>

<figure><img src="/files/MskREKXWOb0bZOwTZXoy" alt=""><figcaption></figcaption></figure>

如果您不想将赠品滑动栏用作弹窗，请点击"打开主题编辑器"来自定义您偏好的显示选项（仅适用于首页、分类、商品和购物车页面）。

* **步骤 1**：在主题编辑器窗口中，导航到您想要添加赠品滑动栏小组件的模块
* **步骤 2**：在左侧边栏中，进入"应用"并点击"添加模块"。

<figure><img src="/files/FMej4sZfxuj95NlgviDe" alt=""><figcaption></figcaption></figure>

* **步骤 3**：窗口打开后，进入"应用"，在搜索栏中输入"Gift slider"，然后选择 BOGOS: Gift Slider。

<figure><img src="/files/mnCDOlZsaE7LGRNFhHbh" alt=""><figcaption></figcaption></figure>

* **步骤 4**：将赠品滑动栏的占位符移动到您想要的位置以吸引顾客，然后点击"保存"。

## 2. 将赠品滑动栏添加到其他店铺页面

**步骤 1：** 在 **Shopify 导航菜单**中前往您的**网店** => 选择**主题** => **自定义**

**步骤 2：** 在 **Shopify 主题编辑器**中，前往您想要添加赠品滑动栏模块的页面。

然后，在左侧面板中向下滚动，点击**添加区块**，选择**应用**，找到并选择 **BOGOS: Gift slider** 模块。<br>

<figure><img src="/files/yKHvbSIrsJxSs24rAASo" alt=""><figcaption></figcaption></figure>

## 常见问题

<details>

<summary><strong>是否有选项可以帮助顾客在赠品滑动栏中快速找到赠品、商品或变体？</strong></summary>

有的！请联系我们的支持团队以在赠品滑动栏上启用"搜索"选项。启用后，顾客可以轻松按商品或变体名称进行搜索。

![](/files/39b1AzdB7z8BMHEqaRPk)

</details>

<details>

<summary><strong>是否可以在购物车抽屉中显示赠品弹窗？</strong></summary>

目前，我们只能在兼容的购物车抽屉中添加赠品弹窗。如果您想提出此需求，请通过在线聊天联系我们，我们的技术团队会先检查您的购物车，然后再进行处理。

</details>

<details>

<summary><strong>我想控制赠品弹窗出现的频率，这可以做到吗？</strong></summary>

可以，您可以通过内置的"关闭滑动栏"选项进行部分控制：

以下是启用此功能的步骤：

* 前往 BOGOS → 自定义 → 赠品滑动栏。
* 在高级设置中，启用"关闭滑动栏开关"。
* 设置持续时间（分钟）——在此期间，如果顾客勾选了该开关，弹窗将不会再次出现。

<div align="left"><img src="/files/41aYm1EklWmBM3CyE6zc" alt="" height="321" width="624"></div>

</details>

<details>

<summary><strong>我可以自动隐藏/禁止缺货商品作为赠品选项吗？</strong></summary>

使用**克隆赠品逻辑**，可以，但不是通过在滑动栏设置中"隐藏"它们；您需要通过库存行为来控制：

检查清单：

* 在 BOGOS → 设置 → 赠品库存管理 中，选择"将赠品数量与原商品数量同步"。
* 在"赠品缺货时"选项中，选择"停止优惠活动"（而非"继续销售"）。
* 确保原商品（或克隆的赠品商品，如果您使用手动库存）在 Shopify 中有正确的库存。

启用"停止优惠活动"后，一旦某个赠品缺货，该优惠活动就会停止，因此缺货的赠品将不再可供选择。

使用**赠品功能逻辑**，缺货的赠品会自动在赠品滑动栏中隐藏，因此您无需执行任何操作。

如果您需要在一个优惠活动内对特定变体进行更精细的隐藏控制，请通过在线聊天联系 BOGOS 支持团队进行定制审核。

</details>

<details>

<summary><strong>如何更改赠品弹窗中赠品的排列顺序？</strong></summary>

要更改赠品弹窗中赠品的排列顺序，请按照以下步骤操作：

1. 进入您创建的优惠活动 > 前往"赠品选择"
2. 点击赠品商品标题前的第一个图标（如我的截图所示）以更改商品顺序

</details>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.bogos.io/cn/detailed-guide/customize/customize-gift-slider.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.