> ## 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의 동작 설정 — 드로어가 열리는 시점과 스토어프론트를 동기화하는 테마 선택자.

[스타일 지정](/ko/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. 대상으로 삼고 싶은 요소(장바구니 아이콘, 수량 숫자, 장바구니 추가 버튼)를 마우스 오른쪽 버튼으로 클릭하고 \*\*검사(Inspect)\*\*를 선택하세요.
3. 열린 패널에서 해당 요소를 나타내는 항목을 찾으세요(수량은 보통 장바구니 아이콘 안의 `span`이에요).
4. 클래스(`.`로 시작) 또는 ID(`#`로 시작)를 확인하세요 — 예: `.header__cart-count span` 또는 `#CartCount`.
5. **Cart settings**로 돌아가 선택자를 **Default + custom** 또는 **Custom only**로 설정하고 붙여넣으세요.
6. 저장한 다음 데스크톱과 모바일 모두에서 테스트하세요.

<Tip>
  **Default**부터 시작하세요 — 대부분의 테마에서 설정 없이 작동해요. 여러 아이콘 중 하나만 업데이트될 때(예: 데스크톱은 되는데 모바일이 안 될 때)는 **Default + custom**을, 기본값이 잘못된 요소를 대상으로 할 때는 **Custom only**를 사용하세요. 어떤 선택자를 써야 할지 잘 모르겠다면 테마 개발자가 알려줄 수 있어요 — 코드를 작성할 필요 없이 복사해서 붙여넣기만 하면 돼요.
</Tip>
