チェックアウトブロックを使用してチェックアウトをカスタマイズするためのブロックの概要

UI拡張機能で構築されたチェックアウトブロックアプリは、チェックアウト・アカウントエディタに直接ドラッグ&ドロップできるアプリブロックを提供することで、チェックアウトのカスタマイズをサポートします。一部のブロックタイプでは、情報や警告のバナー、または項目のメッセージなど、チェックアウトに視覚的なカスタマイズ要素を追加することができます。その他のブロックタイプでは、チェックアウトにインタラクティブな要素を追加し、項目のバリエーションや数量セレクター、お客様が追加情報を選択または入力するためのチェックボックスやテキストフィールドなどを追加することができます。

チェックアウトブロックは、ブロックタイプごとに最大30個の有効なブロックをサポートできます。一度に最大30個のカスタムフィールド、30個の動的コンテンツブロック、または他のタイプのブロックを使用できます。30個以上のブロックを作成できますが、チェックアウトには最初の30個の有効なブロックだけが表示されます。

チェックアウト時に表示されるブロックは、ブロックに適用した表示ルール、ブロックの優先順位、および特定のロケーションに常に特定のブロックを表示するためにアプリブロックIDが使用されているかどうかによって異なります。

チェックアウトブロックで利用可能なアプリブロック

チェックアウトブロックは、複数のタイプのアプリブロックをサポートしています。ブロックタイプは、チェックアウトに追加するコンテンツのタイプ、条件付き表示ルールを追加するかどうか、どのページにブロックを追加するかによって異なります。

ブロック自体の機能により、一部のブロックを特定のチェックアウトページに追加できない場合があります。たとえば、カスタムフィールドブロックは、カスタムメモを追加したりチェックボックスをオンにするなど、お客様が追加情報を入力したことに依存します。この情報は注文が完了する前に取得する必要があるため、サンキューページや注文状況ページなどの購入後ページにカスタムフィールドを追加することはできません。

表：利用可能なCheckout Blocksアプリのブロックと、対応しているチェックアウトページ、各アプリブロックの簡単な説明。
アプリブロック	対応しているページ	説明
住所ブロッカー	チェックアウト	住所フォーマットのルールに基づいてチェックアウトをブロックします。
カスタムフィールド	チェックアウト	利用規約に同意するチェックボックスやギフトメッセージフィールドなど、カスタムフィールドをチェックアウトに含めます。
動的コンテンツ	チェックアウトありがとうございます注文状況	設定した条件付きルールに基づいて、テキスト、バナー、ボタンなどのコンテンツを表示します。このブロックを利用できるのは、Basic Shopify以上のプランに加入しているマーチャントです。
項目編集	チェックアウトありがとうございます注文状況	バリエーションや数量セレクターなど、お客様がチェックアウト注文サマリーの項目を編集できるようにします。項目コンテンツのコンテナとしても機能します。
項目コンテンツ	チェックアウトありがとうございます注文状況	項目固有のメッセージを表示します (例：`最終セール`)。
配送と決済のアイコン	チェックアウト	サポートされている配送方法と決済方法のアイコンを表示します。
静的コンテンツ	チェックアウトありがとうございます注文状況	動的コンテンツブロックとは異なり、このコンテンツはすべてのお客様に表示され、テキストやバナーに対応しています。このブロックを利用できるのは、Basic Shopify以上のプランに加入しているマーチャントです。

アプリブロックの作成について詳しくはこちらをご覧ください。

ブロックの分析

有効なブロックには、Checkout Blocksアプリのブロック詳細ページ上部に表示される表示数の分析情報があります。これらの分析では、そのブロックがチェックアウト時に表示された回数を追跡します。

デフォルトでは、ブロックには今日の分析情報が表示されますが、日付ドロップダウンメニューをクリックして日付セレクターを使用して、特定の日や日付範囲の分析情報を確認することができます。

ブロックの分析をリセットするには、[⋮] > [分析をリセット] をクリックします。この操作は元に戻すことができません。

ブロックのルールを表示する

動的コンテンツやカスタムフィールドブロックなど、多くのブロックタイプでは、チェックアウトブロックをチェックアウト時に表示するために満たす必要のある状況を定義する条件を設定できます。ブロックごとに複数の表示ルールを設定できるほか、ブロックを表示するにはすべてのルールを満たす必要があるか、いずれかのルールを満たせばよいかを定義することもできます。

表示ルールの構文は、構築するブロックのタイプによって異なりますが、一般的には、ルールは該当する場合、次の要素を順番に使用して構築されます。

ルールのカテゴリー (Product typeやCart total)。
論理演算子 (Is、Is not、Is greater than、Contains、Ends inなど)。
必要な特定の値を定義するパラメーター (Dressesや50.00など)。

たとえば、購入金額が高額なお客様にアカウントの作成を促すバナーを表示する場合、次の表示ルールでブロックを作成できます。

Only show when: All rules pass
Cart total > Is greater than or equal to > USD > 100.00
Customer is logged in > False

この一連の表示ルールに従って、お客様が100ドル以上購入し、お客様アカウントにログインしていない場合にのみバナーが表示されます。お客様がログインしている場合にはバナーは表示されません。また、お客様の購入金額が100ドルの基準額に満たない場合にも表示されません。

アプリブロックID

カスタムフィールドや動的コンテンツなどの一部のブロックタイプには、アプリブロックIDを指定するオプションがあります。デフォルトでは、アプリブロックIDは0が選択されます。

アプリブロックIDを使用すると、チェックアウトの各セクションに同じタイプの異なるブロックを追加できます。エディタのチェックアウトアプリブロックはプレースホルダーと考えることができ、ブロック内で設定した表示ルールに応じて複数の対応しているブロックに読み込むことができます。各チェックアウトページには、最大10個のアプリブロックの「プレースホルダー」を追加できます。

例1：異なるアプリブロックIDを使用して、同じタイプのブロックごとに異なるロケーションを指定します。

メインコンテンツエリアに必須チェックボックスを表示し、サイドバーに任意のギフトメモを表示したい場合があります。これらのブロックはどちらもカスタムフィールドブロックタイプを使用します。そのため、チェックアウト・アカウントエディタで [カスタムフィールド] アプリブロックを2回追加し、各ブロックを表示したい場所に配置することができます。ただし、特定のブロックをどのロケーションに配置するかを設定できる必要があります。

必須チェックボックスにはアプリブロックID 1を設定し、任意のギフトメモにはアプリブロックID 2を設定できます。次に、チェックアウト・アカウントエディタで、メインコンテンツエリアの [カスタムフィールド] アプリブロックにアプリブロックID 1を設定して必須チェックボックスを表示し、サイドバーの [カスタムフィールド] アプリブロックにアプリブロックID 2を設定して任意のギフトメモを表示します。

例2：同じアプリブロックIDを使用して、異なる表示ルールを持つ同じタイプのブロックに対して単一のロケーションを指定します。

3つの自動配送ディスカウントを提供します。

25ドル以上のご注文で10%ディスカウント
50ドル以上のご注文で25%ディスカウント
100ドル以上のご注文で無料配送

お客様が注文を完了する前にカートにさらに商品を追加するよう促すために、チェックアウトの [配送方法] セクションに動的バナーを追加し、お客様が達成に最も近づいている配送ディスカウントに基づいてカートにさらに商品を追加するよう促すことができます。

同じアプリブロックID (6など)を持つ3つの動的コンテンツブロックを設定できます。

3つの動的コンテンツブロックの例と、該当する表示ルールとコンテンツを示す表。
ブロック名	ルールの表示	バナーコンテンツ
配送ティア1	カートの合計 > 次の値未満 > 25ドル	「カートに入っている商品の合計金額が25ドル以上の場合、配送料が10%ディスカウントとなります。」
配送ティア2	カートの合計 > 次の値未満 > 50ドル	「カートに入っている商品の合計金額が50ドル以上の場合、配送料が25%ディスカウントとなります。」
配送ティア3	カートの合計 > 次の値未満 > 100ドル	「カートに入っている商品の合計金額が100ドル以上の場合、無料配送となります。」

[配送ティア1] ブロックの並べ替え優先順位が最も高く、[配送ティア3] ブロックの並べ替え優先順位が最も低くなるように設定してください。この場合、お客様の購入金額が25ドルの場合、技術的には3つのブロックすべての表示条件を満たしていますが、ティア1ブロックが最も適切なメッセージとともに表示されます。お客様の購入金額が25ドル以上50ドル未満の場合、ティア3ブロックの条件も技術的には満たしていますが、優先順位が高いティア2ブロックが表示されます。

最後に、チェックアウト・アカウントエディタで、アプリブロックIDが6の単一の動的コンテンツアプリブロックを [配送料] セクションに追加できます。作成した3つの動的コンテンツブロックのうち、最も適切なブロックがチェックアウト時にその「コンテナ」スペースに表示されます。お客様が100ドル以上購入した場合、アプリブロックIDが6の動的コンテンツブロックの表示ルールが満たされていないため、チェックアウトのそのエリアには動的コンテンツは表示されません。