> ## 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)                                 | 文字列                              | ストアのフォーマット  | `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) と[ページビルダーのユースケース](/ja/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 のカート追加インターセプトを完全にオフにします。インターセプトが何をするのか、そしてオプトアウトするあらゆる方法については、[カート追加のインターセプト](/ja/aftersell/cart/add-to-cart-interception)を参照してください。

こうするとテーマ自身が追加を実行し、その submit を待ち受けるすべてのスクリプトが再び動作します。Aftersell は引き続きカートリクエストを通信上で監視するため、ドロワーはいつもどおり開きます。オプトアウトしてもドロワーが失われることはありません。Aftersell が認識するテーマでは、テーマ自身のカートは動かないままになるので、カートが 2 つ表示されることはありません。認識しないテーマでは、テーマが自分のカートをあなたのカートと並べて開いてしまう可能性があります。[テーマのカートも開いてしまう？](/ja/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>

これはページ上のすべてのフォームのインターセプトを無効にする大雑把な手段です。1 つのフォームだけを除外するには、代わりに [`registerSkipAddToCartRule`](/ja/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` クラスを使ってください。[カート追加のインターセプト](/ja/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 がクリックをかき消さなくなると、自分のドロワーを開くタイプのテーマは、あなたのドロワーと並べてそれを開いてしまいます。このオプションを有効にした後にカートが 2 つ表示される場合は、テーマのアイコンに `aftersell-cart-wont-open-cart` クラスを付け、[`actions.open()`](/ja/aftersell/cart/sdk-actions#open-and-close) で自分のハンドラからカートを開いてください。
</Note>

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

[`formatMoney`](/ja/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>

* **[アクション](/ja/aftersell/cart/sdk-actions)**: カートを読み取り、変更します。
* **[フック](/ja/aftersell/cart/sdk-hooks)**: `configure` では大雑把すぎる場合の、フォームごと・ラインごとの制御。
* **[ユースケース](/ja/aftersell/cart/sdk-use-cases)**: よくある要望に対する完全なソリューション。
