[非推奨]VIPデータをLiquidで反映させる

保有ポイント、購入に使用するポイントなどをLiquidを利用して表示する方法です。新規でVIPデータをご活用をお考えの方はVIP Theme SDKを参照してください。Shopify Theme 2.0にご対応のマーチャントはデフォルトのデザインはテーマ内にアプリブロックとして提供されています。

Step1. コードをダウンロードしてテーマ内にコピーする

下記からソースコードをダウンロードしてフォルダー内のディレクトリ名と同じ場所にコピーします。

assets 、snippets 内のすべてのファイルを、テーマ内の同じディレクトリ名の箇所にコピー(もしくは新規作成)する必要があります。

すでに他のUIを表示するためにフォルダー内に存在するファイルがテーマの中にある場合はそのファイルをコピーする必要はありません

Step2. Liquidのコードを追加する

ポイント入力フォームを表示したい箇所に以下のコードを挿入してください。

 {% render '使用したい機能のファイル名' %}

例) {% render 'vip-point-use-form' %}

Step3. cssでUIを調整する

テーマによってcssの当たり方が変わります。各マーチャントのサイトデザインに合わせてcssを直接書き換えてください。

ポイント入力フォームにmax値を設定する

window.vipUsePointFormSetting.maxPointAmount に入力値として受け付ける最大値を設定することでフォームに入力して適用できるポイント数を制限することができます。