見出し画像

ShopifyでLiquidの条件分岐を実装してみよう!PART3

こんにちは!
駆け出しコーダーとして日々業務に励んでいるR.Aです!

前回までの記事では
■Shopify、Liquidとは何か??
■Shopifyのアカウント作成の手順
■Liquidのコードを編集するための手順
■ディレクトリ構造の解説
■どの商品からの問い合わせかをわかるようにするための問い合わせページのカスタマイズ方法
■無料アプリ「Product Reviews」でレビュー機能を付けてみよう!前編・後編
■Shopifyでお気に入り機能を実装してみよう![前編][後編]
■Shopifyで会員オプションを追加してみよう!
■Shopifyでセール機能を実装しよう!
■Shopifyで配送日時を指定できるようにしよう!~前編~~後編~
■Shopifyで特定のタグのときの処理をしてみよう!
■Shopifyでお気に入り実装をしてみよう!(無料アプリ編)
■ShopifyでLiquidの条件分岐を実装してみよう!

上記の13項目について投稿いたしました!
もしまだ読んでいないという方がいましたら、ぜひ一読ください!!

また、今回の記事でPART3になるんですが、PART1、PART2を読んでいない方はこちらからお読みください。

今回の記事でもよく使うLiquidのタグ一覧についてみていきましょう!

2. よく使うLiquidのタグ一覧

(7) {% break %}

{% for x in (1..10) %}
  {% if x == 7 %}
    {% break %}
  {% else %}
    {{ x }}
  {% endif %}
{% endfor %}

{% for x in (1..10) %}で1,2,3…10までの数字を出力しています。
{% for %}ループの中で、上記の場合7に到達した場合にbreakを入れることで、ループを終了するという処理になります。
最後に{% else %}を入れることで1~6までの数字が出力されます。

(8) {% continue %}

{% for x in (1..10) %}
  {% if x == 7 %}
    {% continue %}
  {% else %}
    {{ x }}
  {% endif %}
{% endfor %}

{% break %}は中断の処理です。{% continue %}はスキップの処理です。
上記のコードは{% break %}の箇所でご紹介したコードの{% break %}の箇所を{% continue %}にしたものです。
{% break %}を{% continue %}にすることで7はスキップという処理になります。
その処理を終えたあとは1,2,3,4,5,6,8,9,10の値が出力されます。

まとめ

今回の記事では、{% break %}、{% continue%}のタグ一覧について説明致しました。
ShopifyはLiquidのテンプレート言語で書かれています。コーダーとしてLiquidを書ける知見があればいいですが、それぞれのタグがどういう処理をしているかを理解するのも大切だと思います。
また実際に自分でこれまでご紹介してきたタグを用いて書いてみるのもよいと思います!
次回の記事でも引き続きLiquidのタグについて具体例もあわせて投稿していこうと思います!