1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Liquid】タグとは

Posted at

タグとは

タグは、コードの実行や処理を指示するロジックを定義するために使用される。
特定の条件下でのみコードを実行したり、同じコードを繰り返し行ったりする際にタグを使用する。

コンディショナルタグ(Conditional tags)

コンディショナルタグは、Liquidコードのブロックが実行されるかどうかを決定する条件を定義できる。

if

「もし〜ならば」の条件設定において、条件が真の場合にのみ、特定のコードを実行

unless

「もし〜ならば」の条件設定において、条件が偽の場合にのみコードを実行

elsif

ifタグで設定した条件が偽の場合で別の条件を設定するときに使用

else

if・elsifタグで設定した条件がすべて偽の場合に実行するコードを設定するときに使用

case

whenタグなどと組み合わせて活用することで、変数の値に応じたコードを実行

イテレーションタグ(Iteration tags)

イテレーションタグはコード ブロックを繰り返し実行できる。
リストや配列内の各アイテムに対し、同じ操作を繰り返し適用する際に使用されるケース多い。

for

配列内の各アイテムに対して繰り返し処理を行いたい場合に使用

limit

商品リストの最初2つのアイテムのみを表示したいときなど、forの繰り返し回数を制限する際に使用

offset

forの繰り返しを開始する位置を指定可能

range

数値の範囲を指定して繰り返し処理を行いたい場合に使用

reversed

新着商品をリストの最後に表示するなど、配列のアイテムを逆順で繰り返し処理する際に使用

else

forの繰り返し処理が一度も行われない場合に実行するコードを指定する際に使用

break

forの処理を中断する条件を設定可能

continue

特定の条件下で現在のfor処理の繰り返しを飛ばし、次の繰り返しに進む際で使用

cycle

forの繰り返しで異なる文字列や値を順に出力する際に使用

paginate

配列が50項目など多数のアイテムを含む場合に、アイテムを複数のページに分割表示する場合に使用

変数タグ(Variable tags)

変数タグ使用すると、新しいLiquid変数を作成できできる
Webサイトの中で情報を一時的に保存し、さまざまな箇所で再利用することが可能。
変数タグを使うことでサイトの情報を上手に管理し、見せ方を変えたり、特定の条件下で特別な表示ができる。
また、一度設定した情報は他の場所でも使用可能です。
※定義済みのオブジェクトは、同じ名前の変数によって上書きされる可能性がある。
また、全てののオブジェクトにアクセスできるようにするには、変数名が定義済みのオブジェクトの名前と一致していないことを確認する必要がある

assign

新たに変数を作成し、値を入力する際に使用

capture

商品名に応じて大文字・小文字を決定するなどの複雑な情報を変数に入れる時に使用

decrement

-1から始まり、数値をひとつずつ減らしていく時に使用

increment

0から始まり、数値を1ずつ増やしていく時に使用

テーマタグ(Theme tags)

テーマの一部であるコンテンツを割り当てたりレンダリングしたりできる。
ストア上で、セールなどの特別な情報を記載する箇所(スニペット)を作ることで、サイト上に追加できる。

include

Webサイトのスニペット使用時に利用されていた古い方法で、現在はサイトが遅くなるなどの理由で利用が推奨されていない

javascript

Shopify Liquidでjavascriptを入れる際に使用

layout

Webサイトの大まかなデザインを決める際に使用

render

includeに代わり、Webサイトのスニペットの使用時に利用可能な新しい方法

section

ヘッダーやフッターなどのWebサイトのセクションを表示・作成する際に使用

stylesheet

Webサイトのスタイルを決めるコード(CSS)をセクション内に入れるための場所

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?