Flatto
Flatto
お問い合わせ
設定マニュアル

チェックアウト画面にチェックボックスを追加する(Plus Plan限定)

チェックアウト画面に同意チェックボックスを追加する手順。Plus Planへのアップグレード後、チェックボックスを作成してIDをコピーし、チェックアウト設定のアプリブロックに設定します。Shopify Plus限定機能です。

チェックアウト画面へのチェックボックス追加は、アプリでチェックボックスを作成してIDをコピーし、Shopifyのチェックアウト設定(チェックアウトエディタ)でアプリブロックとして追加する流れで行います。Shopify Plusのマーチャント様で、本アプリのPlus Planのお客様向けの機能です。

1. プランをアップグレード

💡 Plus Planは、Shopify Plusのマーチャント様のみご利用いただけます。

Checkout UI Extensionという仕組みを利用しており、それがShopify Plusのマーチャント様限定の機能になっているためです。

アプリのプランページで、Plus Plan($7.99 USD/月)の「このプランに変更する」ボタンを示した画面

2. チェックアウト画面に表示させるチェックボックスを作成する

アプリのチェックアウト設定ページで「チェックボックスを作成する」ボタンを示した画面

3. 表示文言、表示条件を設定して、保存する

表示文言

チェックボックスの作成画面。タイトル・利用規約チェックボックスの文言・リンク設定・アラートメッセージの入力欄を示した画面

💡 「多言語設定を表示」をクリックすると多言語対応も可能です。

表示条件

  • チェックボックスを表示させる条件を設定可能です。
  • デフォルトの状態だと、全ての場合に表示されます。

表示条件の設定セクション。対象会社・対象とする配送先の国・対象商品・購入金額条件の各項目が並んだ画面

チェックボックスの作成画面で、設定内容のプレビューと画面右上の「保存」ボタンを示した画面

4. チェックボックスIDをコピーする

チェックアウト設定の一覧で、作成したチェックボックスのID横にあるコピーアイコンを示した画面

5. チェックアウト設定画面を開く

Shopify管理画面の「設定」→「チェックアウト」で「カスタマイズ」ボタンを示した画面

6. アプリブロックを選択する

チェックアウトエディタで「ブロックを追加」からcheckbox-assistantのアプリブロックを選択する画面

7. チェックボックスIDを入力して、表示内容を確認して、保存する

チェックアウトエディタのブロック設定で、コピーしたCheckbox IDを貼り付ける入力欄を示した画面

チェックアウト画面のプレビュー上部に「利用規約及びプライバシーポリシーに同意します。」のチェックボックスが表示された画面

チェックアウトエディタで表示内容を確認し、画面右上の「保存」ボタンを示した画面

💡 アラートメッセージは、チェックアウトの設定画面では確認できないため、実際のストアのチェックアウト画面で確認します。

実際のチェックアウト画面で、チェックを入れずに購入しようとした際に「利用規約及びプライバシーポリシーに同意する必要があります。」のアラートが表示された画面

エクスプレスチェックアウトを同意前に非表示にする

利用規約に同意していない場合に、エクスプレスチェックアウト(Apple Pay、Google Pay、PayPal、Shop Pay等)のボタンを非表示にできます。エクスプレスチェックアウトは通常のチェックアウトフローをスキップするため、この機能を有効にすると、エクスプレスチェックアウトを利用するお客様にも確実に利用規約へ同意してもらえます。

💡 こちらもShopify Plusのマーチャント様向けの、Plus Plan限定機能です。