顧客のロケーションに応じたコンテンツを表示する

お客様の配送先住所が特定地域の場合にのみ表示されるカスタムメッセージを、注文状況ページに追加できます。例えば、米国ニューヨーク州のお客様にのみメッセージを表示することができます。複数の地域を指定することも可能です。

手順:

  1. 注文処理セクションの、[追記事項] テキストボックスまでスクロールします。

    注文処理セクション内の追加スクリプトのテキストボックス

  2. [追記事項] テキストボックスに、以下のサンプルコードを貼り付けます。

{% if checkout.shipping_address.country_code == 'US' and checkout.shipping_address.province_code == 'NY' %}
<script type="text/javascript">
  var customMessage = document.createElement("div");
  customMessage.innerHTML = '<div class="section" style="padding-top: 3em"><div class="content-box"><div class="content-box__row"><p class="os-step__description">TYPE YOUR CUSTOM MESSAGE HERE.</p></div></div></div>';
  console.log(document.querySelector("[data-order-summary-section=payment-lines]"));
  document.querySelector("[data-order-summary-section=payment-lines]").before(customMessage);
</script>
{% endif %}
  1. コードを編集して、お客様へのカスタムメッセージを表示する地域を指定します。その際には、コードブロック上部にあるLiquidの {% if %} 文で、国や州の略語を編集する必要があります。現在、米国ニューヨーク在住のお客様にのみ、メッセージが表示される設定です。

- 他の州のお客様にメッセージを表示するには、NYをその州の略語に置き換えます。米国の郵便物に使用されている州の略語については、USPSの州の略語リストで確認できます。 - ニューヨークに加えて他の州に在住のお客様にもメッセージを表示するには、and checkout.shipping_address.province_code == 'XX'を追加して、XXにその州の略語を追加します。他の州をさらに追加する場合は、この手順を繰り返します。 - 他の国のお客様にメッセージを表示するには、USをその国の略語に置き換えます。NYをその国の州の略語に置き換える必要もあります。州を特定しない場合、and checkout.shipping_address.province_code == 'NY'を削除します。

Liquidのif文の記述に関するさらに詳しいガイダンスについては、コントロールフロータグのLiquidリファレンスをご覧ください。

  1. テスト注文を実行し、注文状況ページに結果を表示します。

Shopifyで販売を開始する準備はできていますか?

無料体験を試す