デジタルコンテンツなど、発送不要商品を取り扱う事もあるのに、顧客のアカウントページ(マイページ)には「未発送」という表示が..
Shopifyストアでは、必ずしも発送が必要な商品だけを取り扱う事はないです。
電子チケットなどのデジタルコンテンツや有料ファンクラブの会員資格、引換券(店舗引き渡し商品)など、発送不要商品を取り扱う事もあります。
各商品ページにて「発送不要」の設定ができるものの、会員のアカウントページ(マイページ)の注文履歴には「未発送」と表示され、「あれ？何か送ってくれるの？」と、顧客を誤解させる事もあると思います。
という事で今回は、マイページの注文履歴の文言をカスタマイズする方法について紹介します。
「発送不要」というコレクションを作成
方法はいろいろあると思いますが、私はコレクションで条件分岐する方法を選びました。
以下はその手順。
①予め「発送不要」というコレクションを作っておく
②商品作成時に「発送不要」コレクションを指定
③マイページのテンプレートファイル(main-account.liquid)にてif文を作って条件分岐する
という流れになります。
※コレクションの作成方法については割愛します。
main-account.liquidを修正
では、オンラインストア＞コード編集＞main-account.liquidを開きます。
main-account.liquidとは「マイページ」のテンプレートファイルです。注文履歴や配送先の確認および会員情報が編集できる機能が備わっております。
今回修正するのは注文履歴で、以下のようなHTML構造になっています。
<table role="table" class="order-history">
<thead role="rowgroup">
<tr role="row">
<th></th>
</tr>
</thead>
<tbody role="rowgroup">
<tr role="row">
<td></td>
</tbody>
</table>簡単に説明すると、
①<thead><tr><th>が項目名
②<tbody><tr><td>が項目の値
になります。
今回は、発送に関する項目の値を修正するので、
<td
headers="RowOrder ColumnFulfillment"
role="cell"
data-label="{{ 'customer.orders.fulfillment_status' | t }}">
{{ order.fulfillment_status_label }}
</td>を修正します。
手法としては、コレクション名「発送不要」に該当する商品なら、その値を「発送不要」にするという、条件分岐になります。
<td
headers="RowOrder ColumnFulfillment"
role="cell"
data-label="{{ 'customer.orders.fulfillment_status' | t }}">
{% assign noshipping = false %}
{% for line in order.line_items %}
{% for collection in line.variant.product.collections %}
{% if collection.title == '発送不要' %}
{% assign noshipping = true %}
{% endif %}
{% endfor %}
{% endfor %}
{% if noshipping %}
発送不要
{% else %}
{{ order.fulfillment_status_label }}
{% endif %}
</td>まず、{% assign noshipping = false %}と、変数を作ります。これを「初期化」と言います。
for文のなかで条件に一致するもの(true)があれば、何かの制御を実行するために、初期化(false)する必要があります。
{% for line in order.line_items %}は、for文を使い、注文を１つずつ取り出し処理をするという意味です。
{% for collection in line.variant.product.collections %}は、商品のコレクションを１つずつ取り出し処理（「collection」という変数に代入）をするという意味。
ここでなぜ「variant」が入るかは、バリアントを経由しないと、特定のラインアイテムに関連する正しい商品にアクセスできないからだそうです。
{% for collection in line.product.collections %}だけでできないの？と思いましたが、おそらく正確な商品情報にはたどり着かないらしいです。
if文で条件分岐
次はif文。{% if collection.title == '発送不要' %}と、商品のコレクションのタイトルが「発送不要」と一致するものがあれば、「noshipping」という変数は「true」となる。
これで、2つのfor文は終了します。
そして、{% if noshipping %}(「発送不要」というタイトルのコレクションを持っていれば)「発送不要」と表示され、{% else %}でなければ、注文(order)の変数オブジェクトの{{ order.fulfillment_status_label }}と表示されるようになります。
この「assignでfalse（初期化）→ for文 → if文(条件一致)でassignがtrue」はLiquidでよく使われる組み合わせです。
例えば、注文通知メールにて、以下のようなカスタマイズも可能です。
{% assign female-only = false %}
{% for line in subtotal_line_items %}
{% for collection in line.product.collections %}
{% if collection.title == '女性専用' %}
{% unless female-only %}
<p>美しい女性会員、ご購入ありがとうございます！</p>
{% assign femaleonly = true %}
{% endunless %}
{% endif %}
{% endfor %}
{% endfor %}というふうに、「assignでfalse（初期化）→ for文 → if文(条件一致)でassignがtrue」を活用して、女性会員専用の商品を購入した方に、特別なメッセージを追加する事も可能です。
これは別の記事で解説したいと思います。
