🏗️ テーマ基盤初級
セクション呼び出しのフォーマット
Liquid の section タグを複数行に記述する際の正しいフォーマット例。タグ名を改行で分割しても正しく認識される書き方を示す。
用途
Prettier による Liquid コードのフォーマット設定時に、section タグの行幅超過時の折り返し方法を確認したいとき。
設置場所
このコード自体は Prettier のテスト用ケースであり、実装では section タグを呼び出す際に `{% section 'sectionName' %}` の基本形式を参考にしてセクションを読み込む。
注意点
このスニペットは Prettier プラグインの自動フォーマッタ動作を検証するためのもので、実装コードではない。実際の section タグ呼び出しでは、セクション名（'sectionName'）を自店舗の実際のセクションファイル名に置き換えること。ホワイトスペース制御（`{%-` と `-%}`）はテンプレート内の余白に影響するため、レイアウト要件に応じて使い分ける。
コード
7 行 / liquidIt should never break a name
printWidth: 1
{% section 'sectionName' %}
{% section 'sectionName' %}
{% section 'sectionName' %}
{%- section 'sectionName' -%}
出典・ライセンス
- Repository:
- https://github.com/Shopify/theme-tools
- License:
- MIT
このコードは Shopify 著作の MIT ライセンスソースです。 原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。
関連項目
🏗️ テーマ基盤中級
セクションスキーマのカスタムブロック定義
セクションの schema ブロック内でカスタムブロックタイプを定義する方法を示すサンプル。@theme と _private というプレフィックスで異なるブロック種別を宣言する。
📁 theme-tools·MIT·7 行
🏗️ テーマ基盤初級
レイアウトテンプレートの指定
Liquid の `layout` タグを使い、テーマのレイアウトファイルを指定する構文。複数のレイアウト候補と whitespace 制御（ダッシュ記号）の使い方を示す。
📁 theme-tools·MIT·8 行
🏗️ テーマ基盤上級
Liquid フォーマッター互換のセクション表記
Prettier Liquid プラグインのテストケースで、セクションタグの様々な書式を検証する。異なる間隔・改行・ホワイトスペーストリミングの組み合わせでもセクション名が崩れないことを確認する。
📁 theme-tools·MIT·9 行
🏗️ テーマ基盤初級
基本的なHTMLレイアウト
Prettier Liquid プラグインのテスト用に作られた最小限の HTML テンプレート。DOCTYPE から body タグまでの基本的なドキュメント構造を示す。
📁 theme-tools·MIT·10 行
🏗️ テーマ基盤上級
layout タグのフォーマット
Liquid の layout タグの書式をコード品質ツール(Prettier)でフォーマットするテストケース。スペースや改行位置の違いを正規化し、レイアウト名が壊れないことを検証する。
📁 theme-tools·MIT·10 行
🏗️ テーマ基盤初級
DOCTYPE宣言の構文サンプル
HTML5 と過去の DOCTYPE 宣言パターンを網羅したリファレンス。Prettier による Liquid フォーマッタが複数行 DOCTYPE に対応することを示すテストコード。
📁 theme-tools·MIT·12 行