> ## 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.

# 购物车设置

> Aftersell Cart 的行为设置——抽屉何时打开，以及保持店面同步的主题选择器。

除了[样式](/zh/aftersell/cart/design-settings)之外，购物车还有一些**行为**设置，控制它与你店面的交互方式——抽屉何时打开，以及 Aftersell 让哪些主题元素与购物车保持同步。

<div id="where-to-find-these">
  ## 在哪里找到这些设置
</div>

在购物车编辑器中，打开 **Cart settings**（购物车设置）。以下选项分组在 **Behavior**（行为）和 **Custom selector**（自定义选择器）下。

<div id="open-the-cart-when-an-item-is-added">
  ## 添加商品时打开购物车
</div>

**Open cart when an item is added**（添加商品时打开购物车）控制每次顾客添加产品时抽屉是否自动弹出。默认开启。如果你希望购物车保持关闭状态、直到顾客自己打开，请将其关闭。

<div id="theme-selectors">
  ## 主题选择器
</div>

Aftersell 通过 CSS 选择器与你的店面对接——例如，识别哪个元素用于打开购物车，或需要保持同步的购物车图标数量。内置检测涵盖了最流行的 Shopify 主题（Dawn、Sense、Crave、Debut、Impulse、Horizon 等），因此**大多数商店从不需要修改这些设置**。只有当你的主题上某些功能未正确对接时，才需要调整选择器。

<div id="selector-modes">
  ### 选择器模式
</div>

每个选择器都提供相同的三种模式：

| 模式                             | 作用                                                        |
| ------------------------------ | --------------------------------------------------------- |
| **Default（默认）**                | 对受支持的主题使用 Aftersell 的内置检测。                                |
| **Default + custom（默认 + 自定义）** | 保留内置检测，并在其基础上添加你自己的选择器——当默认检测基本可用但遗漏了某个元素（例如独立的移动端图标）时使用。 |
| **Custom only（仅自定义）**          | 忽略内置检测，只使用你的选择器——当默认检测定位到错误的元素或与你的主题冲突时使用。                |

选择器输入框仅在 **Default + custom** 和 **Custom only** 模式下可用。

<div id="the-three-selectors">
  ### 三个选择器
</div>

| 选择器                                | 定位目标                         | 示例                          |
| ---------------------------------- | ---------------------------- | --------------------------- |
| **Open cart selector（打开购物车选择器）**   | 应打开购物车抽屉的元素。                 | `.header__cart-toggle`      |
| **Add to cart selector（加入购物车选择器）** | Aftersell 应对接的加入购物车按钮。       | `.product-form__add-button` |
| **Cart count selector（购物车数量选择器）**  | 主题购物车图标上显示商品数量的元素，使其与抽屉保持同步。 | `.header__cart-count span`  |

<div id="how-to-find-a-selector">
  ### 如何查找选择器
</div>

1. 在浏览器中打开你的店面（推荐使用 Chrome）。
2. 右键点击你想定位的元素——购物车图标、数量数字或加入购物车按钮——然后选择 **检查**。
3. 在打开的面板中，找到代表该元素的节点（数量通常是购物车图标内的一个 `span`）。
4. 记下它的类名（以 `.` 开头）或 ID（以 `#` 开头）——例如 `.header__cart-count span` 或 `#CartCount`。
5. 回到 **Cart settings**，将选择器设置为 **Default + custom** 或 **Custom only** 并粘贴。
6. 保存，然后在桌面端和移动端都进行测试。

<Tip>
  从 **Default** 开始——它对大多数主题无需任何设置即可工作。当多个图标中只有一个更新时（比如桌面端正常但移动端不行），使用 **Default + custom**；当默认检测定位到错误元素时，使用 **Custom only**。如果你不确定使用哪个选择器，你的主题开发者可以指出来——你不需要编写任何代码，只需复制粘贴即可。
</Tip>