📘 公式リファレンス🏷️ リファレンス/タグ初級
liquid タグ(デリミタなしのLiquidブロック)
複数の Liquid タグを区切り文字なしで記述できるタグ。各タグを個別の行に記述することで、テンプレートの可読性を高める。
用途
複雑な変数代入・条件分岐・ループを連続で書くときに、`{% %}` の重複を減らしてコードを整理したい場合に使う。
設置場所
Liquid テンプレート内で `{% liquid ... %}` ブロックで囲み、その内部に複数の assign タグ、case タグ、echo タグなどを改行して記述する。
注意点
liquid タグ内の各式は改行で区切られるため、1行に複数のタグを記述することはできない。式の出力が必要なときは `echo` タグを明示的に使用する。コメント(`# コメント`)も改行扱いで記述でき、デバッグ時に便利。
仕様
28 行 / json{
"category": "syntax",
"deprecated": false,
"deprecation_reason": "",
"description": "Because the tags don't have delimeters, each tag needs to be on its own line.\n\n> Tip:\n> Use the [`echo` tag](/docs/api/liquid/tags/echo) to output an expression inside `liquid` tags.",
"parameters": [],
"summary": "Allows you to have a block of Liquid without delimeters on each tag.",
"name": "liquid",
"syntax": "{% liquid\n expression\n%}",
"syntax_keywords": [
{
"keyword": "expression",
"description": "The expression to be rendered inside the `liquid` tag."
}
],
"examples": [
{
"name": "",
"description": "",
"syntax": "",
"path": "/products/health-potion",
"raw_liquid": "{% liquid\n # Show a message that's customized to the product type\n\n assign product_type = product.type | downcase\n assign message = ''\n\n case product_type\n when 'health'\n assign message = 'This is a health potion!'\n when 'love'\n assign message = 'This is a love potion!'\n else\n assign message = 'This is a potion!'\n endcase\n\n echo message\n%}",
"parameter": false,
"display_type": "text",
"show_data_tab": true
}
]
}出典・ライセンス
- Repository:
- https://github.com/Shopify/theme-liquid-docs
- License:
- MIT
このコードは Shopify 著作の MIT ライセンスソースです。 原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。
関連項目
📘 公式リファレンス🏷️ リファレンス/タグ中級
doc タグ(テンプレートの注釈・ドキュメント)
Liquid テンプレート内にドキュメンテーションコメントを埋め込むタグ。`{% doc %}` ~ `{% enddoc %}` に囲まれたコンテンツは画面に出力されず、内部の Liquid コードは解析されるが実行されない。コード補完、リンティング、インラインドキュメント機能の実装を支援する。
📁 theme-liquid-docs·MIT·12 行
📘 公式リファレンス🏷️ リファレンス/タグ初級
include タグ(スニペットを埋め込む)
スニペットファイルを Liquid テンプレート内に埋め込んでレンダリングする。埋め込み先の変数にアクセス・変更できるため、親テンプレートと子スニペット間でデータを直接共有する。
📁 theme-liquid-docs·MIT·17 行
📘 公式リファレンス🏷️ リファレンス/タグ中級
javascript タグ(セクション・ブロック内のコード)
セクション、ブロック、スニペット内に JavaScript コードを記述するタグ。このタグ内に書いた JavaScript は Shopify のテーマビルドシステムにより自動的に読み込まれて実行される。
📁 theme-liquid-docs·MIT·17 行
📘 公式リファレンス🏷️ リファレンス/タグ初級
sections タグ(セクショングループを描画)
セクショングループをテーマのレイアウト内で描画するタグ。レイアウトファイル内に配置して、複数のセクションをグループ化した内容を出力する。
📁 theme-liquid-docs·MIT·17 行
📘 公式リファレンス🏷️ リファレンス/タグ初級
stylesheet タグ(CSS定義)
セクション、ブロック、スニペット内で CSS スタイルを定義するタグ。各ファイルにつき1つだけ記述でき、定義した CSS はそのコンポーネント固有の外側スコープで読み込まれて実行される。
📁 theme-liquid-docs·MIT·17 行
📘 公式リファレンス🏷️ リファレンス/タグ初級
break タグ(ループの中断)
for ループの反復処理を途中で停止するタグ。指定した条件に達したら以降の反復をスキップして、ループを抜ける。
📁 theme-liquid-docs·MIT·23 行