はじめに
ECサイトを運営していると、「会員登録をした顧客にのみ、定期購入をさせたい」というニーズが出てくることがあります。
この記事では、そんなニーズを手軽に実現する方法をご紹介します。
技術的な部分も詳しく解説しますので、ECサイト運営者とWeb開発者の方々にとって有益な情報となるでしょう。
前提条件
この手法を適用するためには、以下の条件を満たす必要があります:
- 商品管理画面で、該当商品に「これらの購入オプションでのみこの商品を表示する」のチェックが入っていないこと。
- Liquidファイルの構造を理解していること。
それでは、具体的な手順を見ていきましょう。
手順1: 不要なウィジェットを削除する
まず初めに、テーマのカスタマイズ画面上で、商品ページテンプレートへ「パターン1」や「パターン2」などのウィジェットをブロックで追加して使用している場合、それらを削除します。
手順2: コードを商品ページに埋め込む
商品ページのLiquidファイル、またはそのファイル内で呼び出される別のファイルから、ウィジェットを表示させる位置を探します。そして、以下のコードを挿入します。
{% if customer %}
<div class="huckleberry-subscription-widget-container"></div>
{% else %}
<p>※定期購入をされたい方は、ログインしてください</p>
{% endif %}
コードの詳細解説
1. {% if customer %}
このタグは、現在サイトにアクセスしているユーザーがログイン済みの顧客かどうかを評価します。customer
オブジェクトが存在する場合、そのユーザーは現在ログインしていることを示します。以下のコードは、ログイン済みの顧客に対して定期購買ウィジェットを表示するためのものです。
{% if customer %}
<div class="huckleberry-subscription-widget-container"></div>
....
2. {% else %}
{% else %}
タグは、{% if customer %}
条件が偽の場合に実行されるブロックを定義します。つまり、ユーザーがログインしていない場合に対して適用されるコードです。
{% else %}
<p>※定期購入をされたい方は、ログインしてください</p>
{% endif %}
ここでは、ログインしていないユーザーに対し、「ログインしてください」というメッセージを表示します。
これにより、ユーザーがログインしているかどうかに基づいて定期購買ウィジェットを表示/非表示にすることができます。
また、定期購入を希望しないユーザーは、そのまま単品購入が可能です。
まとめ
この方法を使うことで、定期購入予定のユーザーに対して自然に事前の会員登録を誘導でき、ユーザーからの「(アカウントを作成していないので)ログインができません!」というお問い合わせを減らすことにつながります。
ぜひ、この方法を試してみて、皆さんのECサイトの機能性と顧客満足度の向上にお役立てください。