ECサイトでよくある「注文金額〇〇円で送料無料!」の表示。
以下のコードで完了!
アプリでこれを実装することも可能だが、以下のコードで実装できます!
{%- endif -%}
<p class="announcement-bar__message h5">
{%- assign free_shipping_fee = 1000000 -%}
{% if cart.total_price == 0 %}
<span>注文合計10,000円で送料無料</span>
{% elsif cart.total_price < free_shipping_fee %}
<span>送料無料まであと{{ free_shipping_fee | minus: cart.total_price | money_without_currency }}円</span>
{% else %}
<span>只今、カート内の商品を送料無料で注文できます!</span>
{% endif %}
</p>
{%- if block.settings.link != blank -%}
解説
{% if cart.total_price == 0 %}
で、カートに何も入っていないときの表示を出します。
{% elsif cart.total_price < free_shipping_fee %}
で、商品がカートにはいっている&カートに入っている商品が10,000円未満のときの表示を出します。
{% else %}
で、上記2つ以外の時の条件なので、
カートに入っている商品が10,000円以上のときの表示を出します。
(補足)liquidでの四則演算や変数の宣言方法
shopifyで計算をするときは、
{{計算したい対象 | コマンド | コマンド }}とする
四則演算のコマンドは
100足す
plus:100
100引く
minus:100
100倍する
times:100
100で割る
divided_by:100
他にもround、floorなどがあるようです!
上記計算のコマンドは横に連結して並べることができます。
今回紹介したコード内での例は、
{{ free_shipping_fee | minus: cart.total_price | money_without_currency }}
の部分です。
| minus: cart.total_price
で、「cart.total.price(カート内の合計金額)でマイナスした値を表示してね」と命令を出しており、
| money_without_currency
で、「ストア内での表示通貨で換算して表示してね(日本円なら¥マークも数値の頭に)」
勘の良い方はこれを見てお気づきかもしれませんが、liquidの四則演算は、「計算式」というより、「表示形式」の選択をしているニュアンスが強いです!
なので、複雑な計算をするには不向きです!できなくはなさそうですが、直感的に記述できず、冗長なコードになりそうです。