Liquid Snippets by ALSEL
📘 公式リファレンス🏷️ リファレンス/タグ初級

comment タグ(コード内のコメント記述)

Liquid コード内にコメントを記述するタグ。`{% comment %}〜{% endcomment %}` で囲んだテキストやコード片は出力されず、Liquid 構文も解析されるが実行されない。

用途
テンプレート内で一時的にコード行を無効化したい場合、または後続する構築者向けにコード意図を説明するコメントを残したいとき。
設置場所
Liquid テンプレート内の任意の場所で `{% comment %} コメント内容 {% endcomment %}` の形で使用する。1行コメントの場合は `{% # コメント内容 %}` でも可。
注意点
ブロックコメント `{% comment %}〜{% endcomment %}` は複数行に対応するが、インラインコメント `{% # ... %}` を複数行で使う場合は各行の先頭に `#` を付ける必要がある。`{% liquid ... %}` タグ内でも `{% # ... %}` で行ごとにコメントできる。コメント内のコードは解析されるため、閉じ忘れや構文エラーがあるとテンプレート全体が破綻するので注意する。
タグ:commentannotationsyntaxdebugging

仕様

38 行 / json
{
  "category": "syntax",
  "deprecated": false,
  "deprecation_reason": "",
  "description": "Any text inside `comment` tags won't be output, and any Liquid code will be parsed, but not executed.",
  "parameters": [],
  "summary": "Prevents an expression from being rendered or output.",
  "name": "comment",
  "syntax": "{% comment %}\n  content\n{% endcomment %}",
  "syntax_keywords": [
    {
      "keyword": "content",
      "description": "The content of the comment."
    }
  ],
  "examples": [
    {
      "name": "Inline comments",
      "description": "Inline comments prevent an expression inside of a tag `{% %}` from being rendered or output.\n\nYou can use inline comment tags to annotate your code, or to temporarily prevent logic in your code from executing.\n\nYou can create multi-line inline comments. However, each line in the tag must begin with a `#`, or a syntax error will occur.\n",
      "syntax": "{% # content %}",
      "path": "/",
      "raw_liquid": "{% # this is a comment %}\n\n{% # for i in (1..3) -%}\n  {{ i }}\n{% # endfor %}\n\n{%\n  ###############################\n  # This is a comment\n  # across multiple lines\n  ###############################\n%}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    },
    {
      "name": "Inline comments inside `liquid` tags",
      "description": "You can use inline comment tags inside [`liquid` tags](/docs/api/liquid/tags/liquid). The tag must be used for each line that you want to comment.\n",
      "syntax": "",
      "path": "/",
      "raw_liquid": "{% liquid\n  # this is a comment\n  assign topic = 'Learning about comments!'\n  echo topic\n%}",
      "parameter": false,
      "display_type": "text",
      "show_data_tab": true
    }
  ]
}

出典・ライセンス

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