チェックアウトにポイント利用フォームを表示する

Shopify Plusを契約しているマーチャントはVIPのポイント利用フォームをチェックアウト画面に表示することが可能です。

🎯 合わせてこの記事も読む

VIPの管理画面サイドメニューから プログラム → ポイント を選択してポイントページを開きます。右上の設定を開くボタンをクリックして設定画面を開き、ポイント利用のセクションから以下のように選択してください。

ポイント利用を有効にした際に必要なトークンが設定されていない場合、以下のようなアラートがポイントページに表示されます。

以下のページを参考にポイント利用を実現するために必要なShopifyのカスタムアプリを発行してトークンを管理画面より設定してください。

ソースコードをダウンロードしてフォルダー内のディレクトリ名と同じ場所にコピーします。assets と snippets 内に保存されている全てのファイルをテーマ内の同じディレクトリ名の箇所ににコピー(もしくは新規作成)してください。

こちらからソースコードをダウンロードしてください

Shopifyの管理画面から販売チャネルのオンラインストアをクリックして、テーマセクションからコードを編集を選択してください。ファイル検索を使ってLayoutディレクトリの中にある checkout.liquid を開いてください。このファイルに書かれている実装がチェックアウトの画面に表示されます。

htmlの末尾のbodyのすぐ上に以下と同じコードを追加してください。この一行を追加するだけでチェックアウト画面にポイント入力フォームを表示する対応は終了です。