静的ブロックとネスト設計
静的ブロックで固定要素を配置し、ネストの深さと編集体験を設計できる
最終確認: 2026-09
解説
受託の現場でなぜ必要か： この回では、静的ブロック（運用者が消せないブロック）で固定の要素を置き、ネストの深さを設計できるようになります。
受託では「商品のタイトルと価格は消させたくないが、文字サイズは変えさせたい」という要望に、この仕組みで応えます。
静的ブロックとは、固定の位置に置くブロック
{% content_for 'block', type: 'price', id: 'price' %}で、ブロックを固定の位置に置きます。
運用者は削除・複製・並び替えができず、設定の変更と非表示だけできます。idは、その親（セクションかブロック）の中で一意にします。
テンプレートJSONにはstatic: trueとして保存され、block_orderには入りません。color: '#111'のように任意の引数も渡せ、ブロック側で変数として使えます。
closestとは、一番近い親のリソース
テーマブロックはどのセクションにも置かれ得るので、productを直接受け取れません。
代わりにclosest.product / collection / article / blog / page / metaobjectで、一番近い親のリソースを参照します。
解決の順番は、そのブロックの設定 → 祖先ブロックの設定 → テンプレートのリソースです。
ネストは何階層までにするか
上限は8階層（セクションを除く）ですが、運用者が迷わないのは2〜3階層です。
役割を「レイアウト用」と「コンテンツ用」に分けます。
前者はgroupやrow、後者はtext・image・buttonです。
発展：受け入れる型を絞る
blocks: [{ "type": "text" }, { "type": "button" }]のように、子の型を限定できます。
デザインが崩れる組み合わせを、設計の段階で禁止します。
「何でも入れられる」構成は、半年後に崩れます。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。