> ## 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のブロックを理解する: セクションとサブブロック、商品が入った状態と空の状態、制限、ロックされたブロック、条件、ブロックごとの設定。

カートのレイアウトは、カートエディタで追加、並べ替え、スタイリング、カスタマイズできる構成パーツである**ブロック**の積み重ねです。どのブロックをどの順序で含めるかが、購入者が目にするカートになります。

ブロックが\*\*状態（states）**と**セクション（sections）\*\*の中でどのように配置されるかは、[カートの仕組み](/ja/aftersell/cart/how-carts-work)をご覧ください。

<div id="blocks-and-sub-blocks">
  ## ブロックとサブブロック
</div>

ブロックには2種類あります。

* **ブロック**は、**Header**、**Body**、**Footer** の3つのセクションのいずれかで、カートに直接配置されます。セクションごとに利用できるブロックのセットが異なります。
* **サブブロック**は、別のブロックの中にネストされます。現在サブブロックをホストするのは[**Cart items**](/ja/aftersell/cart/cart-items-block)のみで、**Product** 行（ラインアイテムの行そのもの）、[**Subscription upgrade**](/ja/aftersell/cart/subscription-upgrade-block)、[**Custom code**](/ja/aftersell/cart/custom-code-blocks)があります。

<div id="adding-reordering-and-removing-blocks">
  ## ブロックの追加、並べ替え、削除
</div>

* ブロックの**追加**は **Add block** ピッカーで行います。追加しようとしている場所に配置できない場合、または上限に達している場合、ブロックはグレーアウトされます（ピッカーには `count/max` バッジが表示されます）。
* **並べ替え**は、セクション内でブロックをドラッグして行います。
* **削除**はゴミ箱アイコンで行います。ただし、ロックされたブロック（下記）は削除できません。
* ほとんどのブロックは目のトグルで**表示/非表示**を切り替えられ、削除せずに購入者から見えなくできます。一部の構造的なブロックは非表示にできません: **Cart items**、**Checkout button**、**Product** 行。

<div id="locked-blocks">
  ## ロックされたブロック
</div>

一部のブロックは並べ替えはできますが削除できません。これにより、カートの中核的な動作（たとえばチェックアウト）が誤って削除されることを防ぎます。

* **Cart items**
* **Checkout button**

<div id="default-blocks">
  ## デフォルトのブロック
</div>

新しいカートは、動作するデフォルトレイアウトで始まります。

* **商品が入ったカート:** Header、Banner、Cart items、Summary、Checkout button
* **空のカート:** Header、Empty cartブロック

<Info>
  **空のカート状態**は、空の状態のレイアウト全体を指します。**Empty cartブロック**は、その中の1つのブロックです。違いについては[カートの仕組み](/ja/aftersell/cart/how-carts-work)をご覧ください。
</Info>

<div id="how-many-of-each-block-you-can-add">
  ## 各ブロックを追加できる数
</div>

制限は、カート単位ではなく**カート状態ごと**にカウントされます。商品が入ったカートと空のカートはそれぞれ別枠になるため、1つのカートは、商品が入ったレイアウトに3つ、空のレイアウトにさらに3つのBannerを持つことができます。

ほとんどのブロックは状態ごとに1つに制限されます。例外は次のとおりです。

| ブロック           | カート状態ごとの最大数 |
| -------------- | ----------- |
| Banner         | 3           |
| Image          | 3           |
| Product add-on | 3           |
| Summary        | 2           |
| Custom code    | 無制限         |

<div id="content-design-and-code">
  ## Content、Design、Code
</div>

各ブロックは、エディタ内の最大3つの画面から設定します。

* **Content**: ブロックの設定（テキスト、商品の選択、しきい値など）。**Custom code** ブロックは唯一の例外で、ブロック自体がコード*である*ため、Contentパネルがありません。
* **Design**: グローバルの[**デザイン設定**](/ja/aftersell/cart/design-settings)の上に重なるブロックごとのスタイリング。設定パネル自体がない **Custom code** を除き、すべてのブロックにあります。
* **Code**: ブロックの組み込みレンダリングを[**カスタムテンプレート**](/ja/aftersell/cart/custom-templates)でオーバーライドします。ほとんどのブロックが対応していますが、一部非対応のものもあります。

<div id="show-or-hide-by-market-country-or-currency">
  ## マーケット、国、通貨による表示/非表示
</div>

一部のブロックは、購入者が誰かに応じて異なる設定を表示したり、完全に非表示にしたりできます。これは、全員に対してブロックのオン/オフを切り替えるサイドバーの**目のトグル**とは別の仕組みです。

|        | **目のトグル**                  | **条件（Conditions）**             |
| ------ | -------------------------- | ------------------------------ |
| **動作** | すべての購入者に対してブロック全体を表示または非表示 | 購入者に表示する設定バリアントを選択（または何も表示しない） |
| **基準** | エディタでの選択                   | Shopifyマーケット、顧客の国、または顧客の通貨     |
| **場所** | ほとんどのブロックのサイドバーの目のアイコン     | 条件に対応するブロックの設定パネル              |

**現在対応している条件タイプ:** Shopifyマーケット、顧客の国、顧客の通貨（それぞれ **In** または **Not in**）。カートの合計金額やカートの内容は条件タイプでは**ありません**。金額/数量の進捗には[Rewards](/ja/aftersell/cart/rewards-block)の階層しきい値を、エディタで表現できないルールが必要な場合は[Cart SDK](/ja/aftersell/cart/sdk-overview)を使用してください。

条件は順序付きリストで、**最初に一致した**条件が優先されます。具体的なルールを **All buyers** のキャッチオールより上に置いてください。何も一致しない場合、そのブロックはその購入者には何もレンダリングしません。

**現在のエディタでは**、完全なConditions UIは[**Rewards**](/ja/aftersell/cart/rewards-block#per-market-rewards)ブロックに搭載されています。マーケット、国、通貨ごとに異なる階層セットを設定できます。他のブロックは、単一の「all buyers」設定を使用するか、まだこのシステムに参加していません。

エディタのプレビューは、実際の購入者を評価**しません**。パネルで条件を選択すると、そのバリアントをプレビューできます。

<div id="all-blocks">
  ## すべてのブロック
</div>

**構造**

* [Header](/ja/aftersell/cart/header-block): タイトル、アイテム数、ロゴ、閉じるボタン。上部に固定。
* [Cart items](/ja/aftersell/cart/cart-items-block): 顧客がカートに追加したアイテム。行ごとに繰り返し表示。
* [Subscription upgrade](/ja/aftersell/cart/subscription-upgrade-block): ラインアイテムのサブスクリプションへの変換を提案するサブブロック。
* [Summary](/ja/aftersell/cart/summary-block): 合計、節約額、適用された割引。
* [Checkout button](/ja/aftersell/cart/checkout-button-block): チェックアウトへの主要なCTA。
* [Empty cart](/ja/aftersell/cart/empty-cart-block): カートが空のときに表示されるコンテンツ。
* [Express payments](/ja/aftersell/cart/express-payments-block): カート内の高速チェックアウトボタン（Shop Pay、PayPalなど）。

**マーチャンダイジング**

* [Upsells](/ja/aftersell/cart/upsells-block): ストラテジーが選んだ商品レコメンデーション。
* [Product add-on](/ja/aftersell/cart/product-add-on-block): アドオンとして提案される特定の1商品。
* [Rewards](/ja/aftersell/cart/rewards-block): 送料無料やギフトなどの段階的なリワード。
* [Shipping protection](/ja/aftersell/cart/shipping-protection-block): オプトイン式の配送保護アドオン。

**購入者の入力**

* [Discount code](/ja/aftersell/cart/discount-code-block): 割引コードを適用するフィールド。
* [Notes](/ja/aftersell/cart/notes-block): 注文メモのフィールド。

**コンテンツ**

* [Banner](/ja/aftersell/cart/banner-block): メッセージバナー。オプションのカウントダウンタイマー付き。
* [Image](/ja/aftersell/cart/image-block): 単一の画像、または支払いアイコンなどのホスト済みプリセット。
* [Custom code](/ja/aftersell/cart/custom-code-blocks): カート内の任意の場所に配置できるカスタムHTMLまたはReact。

**拡張**

* [カスタムテンプレート](/ja/aftersell/cart/custom-templates): Codeタブから任意のブロックのレンダリング方法をオーバーライド。

<div id="blocks-available-in-each-section">
  ## 各セクションで利用可能なブロック
</div>

セクションごとに利用できるブロックのセットが異なります。これによりレイアウトの焦点が保たれ、散らかりを防ぎます。

| セクション      | 利用可能なブロック                                                                                                                                |
| ---------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
| **Header** | Header、Banner、Rewards、Image、Custom code                                                                                                  |
| **Body**   | Banner、Notes、Discount code、Cart items、Empty cart、Custom code、Rewards、Product add-on、Shipping protection、Image、Upsells                    |
| **Footer** | Banner、Notes、Discount code、Custom code、Rewards、Product add-on、Shipping protection、Express payments、Image、Upsells、Summary、Checkout button |

これらのブロックの一部は状態固有です（たとえばEmpty cartは空の状態のみ）。[カートの仕組み](/ja/aftersell/cart/how-carts-work)をご覧ください。

<div id="block-validation-errors">
  ## ブロックのバリデーションエラー
</div>

ブロックの設定に無効な値が含まれている場合、サイドバーのそのブロック名の横に小さな赤い点が表示されます。この点は問題を修正するまで残ります。閉じられる通知ではありません。

いずれかのブロックにエラーがある間、**保存はブロックされます**。**Save** ボタンはクリック可能なままですが、選択するとエラートースト（*「Fix the errors in your cart blocks before saving」*）が表示され、問題のある最初のブロックにジャンプし、その設定が開いてハイライトされたフィールドを修正できるようになります。**Publish** はさらに未保存の変更がないことを必要とするため、正常な保存が完了するまで利用できないままになります。

無効なフィールドを修正すると、赤い点は自動的に消え、保存は通常どおり進みます。

<Note>
  非表示のブロックもバリデーションの対象です。非表示にしたブロックも無効な設定を持ち、エラーの点を表示し、表示中のブロックとまったく同じように保存をブロックすることがあります。保存がブロックされているのに表示中のブロックがすべて問題なさそうな場合は、非表示のブロックを確認してください。
</Note>