ログイン
無料体験を始める

チェックアウトブロックを使用した一般的なチェックアウトのカスタマイズ

チェックアウトブロックを使用して、さまざまな方法でチェックアウトをカスタマイズできます。このページには、チェックアウトブロックを使用した一般的なチェックアウトのカスタマイズの簡単なガイドが含まれています。

目次

特定のカート値の配送ディスカウント階層を作成する

「50ドル以上の注文の場合は配送料が50%オフ」や「100ドルを超える注文の場合は無料配送」などの配送ディスカウントの階層を作成する場合は、カートの小計ルールに基づいて複数の自動配送ディスカウントを作成できます。複数のディスカウントの基準を満たすチェックアウトには、最もディスカウント率が高い配送ディスカウントが適用されます。

手順

  1. 管理画面で [アプリ] > [チェックアウトブロック] の順に移動します。
  2. [ディスカウント] > [ディスカウントを追加] > [配送の割引金額] の順にクリックします。
  3. [配送の割引金額] セクションで、[自動ディスカウント] を選択し、ディスカウントのメッセージを追加します (例：50ドル以上のご注文で配送料が50%オフ)。

  4. [ディスカウント設定] セクションで、カスタムのディスカウントルールセットを作成します。

    1. [ディスカウント価格] ドロップダウンメニューで、[割引率] を選択し、50%を追加します。
    2. [ディスカウントルール] セクションで、ルールセットを設定します。
      1. [⊕ルールを追加] をクリックします。
      2. ルールをCart subtotal > Is greater than or equal to > 50.00になるように設定します。

  5. 任意：以下のオプションを設定できます。

    • [配送オプション]：ディスカウントを適用する配送オプションを指定します。特定のオプションを選択する際には、タイトル、価格、配送タイプ別にオプションを適用するよう選択できます。
    • [組み合わせ]：お客様がクーポンコードを商品や注文のディスカウントと組み合わせることができるようにします。
    • [有効期間]：ディスカウントの開始日時と有効期限を指定します。

  6. [サマリー] セクションで、ディスカウントの詳細を確認し、正しく設定されていることを確認します。

  7. [保存] をクリックします。

  8. 管理画面で [アプリ] > [チェックアウトブロック] の順に戻ります。

  9. [ディスカウント] > [ディスカウントを追加] > [配送の割引金額] の順にクリックします。

  10. [配送の割引金額] セクションで、[自動ディスカウント] を選択し、ディスカウントのメッセージを追加します (例：100ドル以上のご注文で無料配送)。

  11. [ディスカウント設定] セクションで、カスタムのディスカウントルールセットを作成します。

    1. [ディスカウント価格] ドロップダウンメニューで、[無料配送] を選択します。
    2. [ディスカウントルール] セクションで、ルールセットを設定します。
      1. [⊕ルールを追加] をクリックします。
      2. ルールをCart subtotal > Is greater than or equal to > 100.00になるように設定します。

  12. 任意：以下のオプションを設定できます。

    • [配送オプション]：ディスカウントを適用する配送オプションを指定します。特定のオプションを選択する際には、タイトル、価格、配送タイプ別にオプションを適用するよう選択できます。
    • [組み合わせ]：お客様がクーポンコードを商品や注文のディスカウントと組み合わせることができるようにします。
    • [有効期間]：ディスカウントの開始日時と有効期限を指定します。

  13. [サマリー] セクションで、ディスカウントの詳細を確認し、正しく設定されていることを確認します。

  14. [保存] をクリックします。

簡単なチェックアウト方法の下にある「OR」のコピーを変更する

配送と決済のアイコンブロックを移動して、簡単なチェックアウトの決済オプションの下の----または----分割線の下に表示し、「OR」テキストを「受け付け中の決済タイプ」や「サポートされている配送業者」など、希望するカスタムテキストに変更できます。

チェックアウト時の簡単な決済ボタンと追加の決済アイコンの画像。「OR」の分割線が強調表示されます。

手順

  1. チェックアウト・アカウントエディタで配送と決済のアイコンブロックを作成して設定します。
  2. [配送と決済のアイコン] ブロックをドラッグ&ドロップして、[ウォレット] セクションの下に表示します。
  3. 管理画面で [オンラインストア] > [テーマ] の順に移動します。
  4. ライブテーマで、[...] > [デフォルトテーマのコンテンツを編集する] の順にクリックします。
  5. 検索バーを使用して、alternativeという用語を検索します。
  6. [チェックアウトの代替決済方法バナー] で、[Or] フィールドを変更してカスタムテキストを含めます。
  7. [保存] をクリックします。

特定の配送方法の下にメッセージを表示する

動的コンテンツブロックを使用して、チェックアウト時に特定の配送方法の下にメッセージを表示することができます。

たとえば、Standard、Express、International Expressの配送料を提供している場合は、「International」の配送オプションの下に簡単なメッセージを表示して、表示される配送価格に関税の料金が含まれていないことを明確にできます。

手順

  1. 管理画面で [アプリ] > [チェックアウトブロック] の順にクリックします。
  2. [ブロック] で、[ブロックを作成] をクリックします。
  3. [動的コンテンツ] をクリックします。
  4. [ブロック名] セクションで、ブロックの名前を入力します。この名前はお客様には表示されません。
  5. [アプリブロックID] セクションで、IDを [ダイナミック] として設定するか、または特定のID番号を適用します。アプリブロックIDについて詳しくはこちらをご覧ください。

  6. [表示ルール] セクションで、特定の配送方法が含まれている場合にのみ表示するブロックの表示ルールを設定します。この例では、International Expressの下に表示するようにルールを設定します。

    1. [⊕表示ルールを追加] をクリックします。
    2. [ルールを選択] ダイアログで、[配送方法のタイトル] を選択します。
    3. このルールを [以下を含む] > [International] として設定します。

  7. [コンテンツ] セクションで、ブロックのコンテンツを追加およびカスタマイズします。

    1. [コンテンツアイテム] セクションで、[⊕コンテンツアイテムを追加] をクリックし、[テキスト] を選択します。
    2. コンテンツ項目ダイアログで、簡単なメッセージ (例：追加で関税が適用される場合があります) を追加し、[完了] をクリックします。

  8. 任意：[公開] セクションで、鉛筆アイコンをクリックして、ブロックを表示するマーケットページとチェックアウトページを選択します。

  9. [保存] をクリックし、ブロックステータスを [有効化] に設定します。

  10. チェックアウト・アカウントエディタで、チェックアウトの [配送料] セクションに動的ブロックを追加します。

  11. [保存] をクリックします。

注文明細表にカスタムフィールドを含める

チェックアウトブロックを使用すると、ストアはカスタムフィールドブロックを使用してお客様データを収集し、そのデータを注文のメタフィールドに保存することができます。

手順

  1. チェックアウトブロックで、カスタムフィールドブロックを作成して設定します。ブロックが注文のメタフィールドとして保存されるように設定されていることを確認します。
  2. 管理画面で、[設定] > [配送と配達] に移動します。
  3. [明細表] セクションで、[明細表テンプレート] をクリックします。
  4. カスタムフィールド値を表示するテンプレートのロケーションで、以下のコード行を追加します。keyをカスタムフィールドのキーに置き換えてください。 
{{ order.metafields.checkoutblocks.key }}
  1. 任意：カスタムフィールド値を条件付きで表示する場合、必要な条件に基づいてコンテンツをLiquid if/else文で囲むことができます。
  2. [保存] をクリックします。

明細表のテンプレートでは、複数のカスタムフィールドキー値を使用できます。たとえば、このコードでは、お客様が注文条件 (agree_to_termsをキーとして使用したメタフィールド) に同意した場合にのみ、注文の注文書番号 (poをキーとして使用したメタフィールド) が表示されます。

{% if order.metafields.checkoutblocks.agree_to_terms %}
    PO #{{ order.metafields.checkoutblocks.po }}
{% endif %}

注文のカスタムフィールドをお客様のプロフィールに追加する

Shopify Flowアプリを活用して、カスタムフィールドブロックで収集した注文データを同期できます。

お客様プロフィールにbirth_dateメタフィールド値を追加する.flowファイルのサンプルをダウンロードできます。追加するカスタムフィールドキーに合わせて、このテンプレートの値をカスタマイズします。

手順

  1. チェックアウトブロックで、カスタムフィールドブロックを作成して設定します。ブロックが注文のメタフィールドとして保存されるように設定されていることを確認します。

  2. Shopify Flowで、注文が行われる際に実行するカスタムワークフローを設定します。

    1. [ワークフローを作成] > [トリガーを選択] の順にクリックします。
    2. [Shopify] > [注文が作成されたとき] の順に選択します。
    3. トリガーで、[次に⊕] > [条件] の順にクリックします。
    4. [変数を追加] をクリックし、[注文] > [メタフィールド] > [キー] の順に選択します。
    5. [キー] フィールドで、お客様プロフィールに追加するカスタムフィールドのキーを追加します (birth_dateなど)。
    6. 条件で、[次に⊕] > [アクション] の順にクリックします。
    7. [Shopify] > [お客様のメタフィールドを更新する] の順にクリックします。

  3. [お客様のメタフィールドを更新する] セクションで、次の情報を入力します。

    1. メタフィールドネームスペース：追加するメタフィールド (personal_infoなど)。
    2. キー：メタフィールドキー (dobなど)。
    3. タイプ：含める値のタイプ (日付など)。
    4. 値： 
{% assign dob_key = "birth_date" %}
{% for metafields_item in order.metafields %}
{% if metafields_item.key == dob_key %}
    {{metafields_item.value}}
{% endif %}
{% endfor %}

フローが完了したら、[ワークフローを有効にする] をクリックして有効化します。

お探しの情報が見つかりませんか？いつでもお気軽にお問い合わせください。