> ## 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の動作設定 — ドロワーが開くタイミングと、ストアフロントを同期させるテーマセレクター。

[スタイリング](/ja/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>

各セレクターには同じ3つのモードがあります。

| モード                  | 動作内容                                                                                  |
| -------------------- | ------------------------------------------------------------------------------------- |
| **Default**          | 対応テーマに対してAftersellの組み込み検出を使用します。                                                      |
| **Default + custom** | 組み込みの検出を維持したまま、独自のセレクターを追加します — デフォルトはほぼ機能するものの、一部の要素（たとえば別のモバイルアイコン）を検出できない場合に使用します。 |
| **Custom only**      | 組み込みの検出を無視して、独自のセレクターのみを使用します — デフォルトが間違った要素を対象にしていたり、テーマと競合したりする場合に使用します。            |

セレクター入力欄は、**Default + custom**モードと**Custom only**モードでのみ有効になります。

<div id="the-three-selectors">
  ### 3つのセレクター
</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**から始めてください — ほとんどのテーマでは設定不要で機能します。複数あるアイコンのうち1つしか更新されない場合（たとえばデスクトップは動作するがモバイルが動作しない場合）は**Default + custom**を、デフォルトが間違った要素を対象にしている場合は**Custom only**を使用してください。どのセレクターを使うべきかわからない場合は、テーマ開発者に確認してもらえます — コードを書く必要はなく、コピーして貼り付けるだけです。
</Tip>
