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

# Configure

> 모든 Aftersell Cart SDK configure 옵션: 드로어 열기, 장바구니 담기 가로채기, 폼 검증, 금액 형식 지정입니다.

`configure(config)`는 장바구니의 동작 방식을 설정해요. **설정용 호출**이므로 장바구니가 로드되기 전 스크립트 맨 위에서 호출해도 안전해요.

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({
  open_on_add_to_cart: 'always',
  money_format: '${{amount}} USD',
});
```

여러 번 호출할 수 있으며 값은 병합돼요. 나중에 호출하면 지정한 키만 재정의하고 나머지는 그대로 유지돼요.

<Warning>
  **`undefined`를 전달하면 키를 건너뛰는 게 아니라 지워져요.** `configure({ open_on_add_to_cart: undefined })`는 이전 호출에서 설정한 값을 버리고 해당 옵션을 기본값으로 초기화해요. 옵션을 그대로 두려면 키를 아예 생략하세요.
</Warning>

<div id="options">
  ## 옵션
</div>

| 옵션                                                              | 값                                  | 기본값         | 목적                               |
| --------------------------------------------------------------- | ---------------------------------- | ----------- | -------------------------------- |
| [`open_on_add_to_cart`](#open_on_add_to_cart)                   | `'always'`, `'never'`, `'default'` | `'default'` | 상품이 추가될 때 드로어를 열지 여부예요.          |
| [`open_on_background_add`](#open_on_background_add)             | `boolean`                          | `false`     | *다른 무언가*가 장바구니에 추가할 때도 열어요.      |
| [`validate_form_on_add_to_cart`](#validate_form_on_add_to_cart) | `boolean`                          | `false`     | 상품 폼이 유효하지 않으면 추가를 차단해요.         |
| [`skip_add_to_cart_interceptor`](#skip_add_to_cart_interceptor) | `boolean`                          | `false`     | Aftersell의 장바구니 담기 가로채기를 완전히 꺼요. |
| [`skip_open_cart_interceptor`](#skip_open_cart_interceptor)     | `boolean`                          | `false`     | 장바구니 아이콘 클릭이 다른 스크립트에 도달하게 해요.   |
| [`money_format`](#money_format)                                 | string                             | 스토어 형식      | `formatMoney`가 사용하는 형식을 재정의해요.   |

***

<div id="open_on_add_to_cart">
  ## open\_on\_add\_to\_cart
</div>

쇼핑객이 상품을 추가할 때 드로어를 열지 여부를 제어해요.

| 값           | 동작                                                     |
| ----------- | ------------------------------------------------------ |
| `'always'`  | 추가 시 항상 드로어를 열어요.                                      |
| `'never'`   | 절대 열지 않아요. 상품이 조용히 추가돼요.                               |
| `'default'` | 장바구니 에디터의 **Open cart when an item is added** 설정을 따라요. |

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
// Always open, regardless of the merchant's cart setting.
window.aftersell.cart.configure({ open_on_add_to_cart: 'always' });
```

일반적인 사용 예는 다른 곳에서는 판매자 설정을 그대로 두면서 특정 페이지 하나에서만 드로어를 닫아 두는 것이에요:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
if (window.location.pathname.startsWith('/collections/')) {
  window.aftersell.cart.configure({ open_on_add_to_cart: 'never' });
}
```

<Note>
  스토어 전체에 적용하고 싶다면 이미 설정이 있어요: **Cart settings → Content → Behavior → Open cart when an item is added**. 페이지, 쇼핑객, 또는 코드만 아는 조건에 따라 결정이 달라질 때 `configure`를 사용하세요.
</Note>

<div id="open_on_background_add">
  ## open\_on\_background\_add
</div>

이 값을 `true`로 설정하면 **백그라운드** 추가 — Aftersell이 감지했지만 직접 처리하지 않은 추가 — 에서도 드로어가 열려요.

다음 중 하나에 해당하면 추가가 백그라운드로 간주돼요:

* [Shopify의 표준 장바구니 이벤트](https://shopify.dev/docs/storefronts/themes/best-practices/standard-events)를 통해 도착한 경우(무엇이 트리거했든 항상 백그라운드로 처리), 또는
* Aftersell이 네트워크에서 장바구니 요청을 감지했는데 직전 약 3초 동안 신뢰할 수 있는 클릭이나 키 입력이 **없었던** 경우 — 예를 들어 다른 앱이나 스크립트가 장바구니에 쓰는 경우예요.

쇼핑객의 클릭 이후에 발생해 Aftersell이 네트워크에서 감지한 추가는 백그라운드 추가가 아니에요: 이 옵션 없이도 `open_on_add_to_cart`에 따라 이미 드로어가 열려요.

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ open_on_background_add: true });
```

이것은 **재정의가 아니라 추가 게이트예요**: 백그라운드 추가는 `open_on_add_to_cart`도 허용했을 경우에만 드로어를 열어요. `open_on_add_to_cart: 'never'`이면 이 옵션은 아무 동작도 하지 않아요.

<Tip>
  서드파티 추가 버튼이 상품은 올바르게 추가하지만 드로어는 닫혀 있을 때 이 옵션을 사용하세요. 상품이 장바구니에 아예 도달하지 않는다면 가로채기 문제예요. [`skip_add_to_cart_interceptor`](#skip_add_to_cart_interceptor)와 [페이지 빌더 사용 사례](/ko/aftersell/cart/sdk-use-case-page-builder)를 참고하세요.
</Tip>

<div id="validate_form_on_add_to_cart">
  ## validate\_form\_on\_add\_to\_cart
</div>

추가하기 전에 브라우저의 네이티브 폼 검증(`reportValidity()`)을 실행하고, 폼이 유효하지 않으면 추가를 취소해요. 상품 폼에 쇼핑객이 현재 건너뛸 수 있는 필수 필드(각인 메시지, 선물 메모, 필수 체크박스)가 있을 때 사용하세요.

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ validate_form_on_add_to_cart: true });
```

브라우저가 문제가 있는 필드에 자체 검증 메시지를 표시해요. 기본값은 꺼짐이에요. 상품 폼 어딘가에 잘못된 `required` 속성이 있는 테마가 장바구니 담기를 조용히 차단하기 시작할 수 있기 때문이에요.

<div id="skip_add_to_cart_interceptor">
  ## skip\_add\_to\_cart\_interceptor
</div>

Aftersell의 장바구니 담기 가로채기를 완전히 꺼요. 가로채기가 무슨 일을 하는지, 그리고 이를 제외하는 모든 방법은 [장바구니 담기 가로채기](/ko/aftersell/cart/add-to-cart-interception)를 참고하세요.

그러면 테마가 추가를 직접 수행하고, 그 submit을 듣고 있던 모든 스크립트가 다시 실행돼요. Aftersell은 여전히 네트워크에서 장바구니 요청을 감지하므로 드로어는 평소처럼 열려요. 이 옵션을 켜도 드로어를 잃지 않아요. Aftersell이 인식하는 테마에서는 테마 자체의 장바구니가 비활성 상태로 유지되므로 두 개의 장바구니가 나타나지 않아요. 인식하지 못하는 테마에서는 테마가 자체 장바구니를 여러분의 장바구니와 함께 열 수 있어요. [테마의 장바구니도 열리나요?](/ko/aftersell/cart/add-to-cart-interception#will-the-themes-cart-open-too)를 참고하세요.

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ skip_add_to_cart_interceptor: true });
```

<Warning>
  이 옵션은 **부팅 시 한 번만** 읽혀요. 장바구니가 로드되기 전에 실행되는 설정용 호출, 즉 장바구니의 **Initialization** 스크립트에서만 작동해요. 나중에(`ready()` 내부나 이벤트 핸들러에서) 설정하면 아무 효과가 없으며 조용히 실패해요.
</Warning>

이 옵션은 페이지의 모든 폼에 대해 가로채기를 비활성화하는 무딘 도구예요. 폼 하나만 제외하려면 대신 [`registerSkipAddToCartRule`](/ko/aftersell/cart/sdk-hooks#registerskipaddtocartrule) 훅을 사용하세요:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
// Preferred: exempt only the forms you own.
window.aftersell.cart.hooks.registerSkipAddToCartRule((form) =>
  form.hasAttribute('data-skip-aftersell')
);
```

<div id="skip_open_cart_interceptor">
  ## skip\_open\_cart\_interceptor
</div>

장바구니 아이콘을 클릭하면 Aftersell 드로어가 열려요. 이를 안정적으로 처리하기 위해 Aftersell은 페이지의 다른 어떤 것도 이 클릭을 처리하지 못하도록 클릭을 멈춰요. 이 과정에서 **여러분의** 스크립트도 클릭을 볼 수 없게 돼요. 애널리틱스나 픽셀 이벤트가 장바구니 아이콘을 제외한 모든 곳에서는 발생한다면, 바로 이 때문이에요.

클릭 무음화를 중단하려면 이 값을 `true`로 설정하세요:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ skip_open_cart_interceptor: true });
```

그러면 리스너가 실행되고, 드로어는 이전과 동일하게 열려요. 클릭이 여전히 `/cart`로 이동하지도 않아요.

<Warning>
  **이 옵션은 이름이 시사하는 것보다 하는 일이 적어요.** 장바구니 아이콘 인터셉터를 건너뛰지 않아요. 다른 리스너를 무음화하는 것만 중단해요. Aftersell은 여전히 클릭을 처리하고 여전히 장바구니를 열어요. Aftersell이 완전히 무시해야 하는 컨트롤에는 대신 `aftersell-cart-wont-open-cart` 클래스를 사용하세요. [장바구니 담기 가로채기](/ko/aftersell/cart/add-to-cart-interception#the-cart-icon-is-separate)를 참고하세요.
</Warning>

[`skip_add_to_cart_interceptor`](#skip_add_to_cart_interceptor)와 달리 이 옵션은 **매 클릭마다** 읽히므로, 어느 시점에든 설정할 수 있고 즉시 적용돼요: `ready()`에서, 이벤트 핸들러에서, 또는 페이지별로 조건적으로 설정할 수 있어요.

<Note>
  일부 테마는 장바구니 아이콘 클릭에 자체적으로 반응하기도 해요. Aftersell이 무음화를 멈추면, 자체 드로어를 여는 테마는 여러분의 드로어와 함께 열어요. 이 옵션을 켠 뒤 두 개의 장바구니가 보인다면, 테마의 아이콘에 `aftersell-cart-wont-open-cart` 클래스를 추가하고 [`actions.open()`](/ko/aftersell/cart/sdk-actions#open-and-close)으로 여러분의 핸들러에서 장바구니를 여세요.
</Note>

<div id="money_format">
  ## money\_format
</div>

[`formatMoney`](/ko/aftersell/cart/sdk-actions#formatmoneycents)가 사용하는 [Shopify 금액 형식](https://shopify.dev/docs/api/liquid/filters/money)을 재정의해요. 기본값은 스토어 자체 형식이며, 이를 사용할 수 없으면 가격은 `$X.XX`로 대체돼요.

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.aftersell.cart.configure({ money_format: '${{amount}} USD' });

// Later:
window.aftersell.cart.actions.formatMoney(5779); // "$57.79 USD"
```

`configure`는 병합되고 `formatMoney`는 실시간 값을 읽기 때문에, 예를 들어 통화 전환기가 동작할 때 런타임에 형식을 변경할 수 있어요:

```js theme={"theme":{"light":"snazzy-light","dark":"github-dark"}}
window.myTheme.onCurrencyChange((currency) => {
  window.aftersell.cart.configure({ money_format: FORMATS[currency] });
  window.aftersell.cart.actions.visualRefresh(); // repaint prices already on screen
});
```

<Note>
  이것은 SDK와 장바구니가 가격을 *표시*하는 방식을 변경해요. 쇼핑객에게 청구되는 통화는 바꾸지 않아요. 그것은 Shopify Markets의 역할이에요.
</Note>

<div id="where-to-go-next">
  ## 다음 단계
</div>

* **[액션](/ko/aftersell/cart/sdk-actions)**: 장바구니를 읽고 변경하세요.
* **[훅](/ko/aftersell/cart/sdk-hooks)**: `configure`가 너무 광범위할 때 폼별, 라인별로 제어하세요.
* **[사용 사례](/ko/aftersell/cart/sdk-use-cases)**: 일반적인 요청에 대한 완전한 솔루션이에요.