ブロック②:テーマブロック
テーマブロックの仕組み(独立ファイル・再利用・ネスト)を説明し、Horizonのセクション構造を読める
最終確認: 2026-09
解説
受託の現場でなぜ必要か: この回では、テーマブロック(ファイルとして独立した、使い回せるブロック)の仕組みとHorizonの構造が分かります。
受託ではHorizonの改修でこの仕組みが前提になるので、Dawn系との違いを説明できる必要があります。
テーマブロックとは、1ファイルで独立したブロック
テーマブロックは、blocks/text.liquidのように1ブロック1ファイルで、自分の{% schema %}を持ちます。
テーマ内のどのセクションからも使え、ブロックの中にブロックを入れられます。
テーマあたり300個まで置けます(執筆時点の公式値)。
受け入れる側には@themeと書く
セクションやブロックのschemaに"blocks": [{ "type": "@theme" }]と書くと、すべてのテーマブロックを受け入れます。{ "type": "@app" }を足すと、アプリブロックも受け入れます。
描画する位置は、{% content_for 'blocks' %}で指定します。
Horizonは、薄いセクションをブロックの入れ子で組む
Horizonでは、セクションは薄い器です。group(レイアウト用のブロック)の中に、テキスト・画像・ボタンのブロックを入れ子にして画面を組みます。
Dawn系とは設計の考え方が違い、自動変換はできません。
発展:静的ブロックと、blocks/の意味
{% content_for 'block', type: 'text', id: 'heading' %}と書くと、位置を固定したブロック(静的ブロック)を置けます。
マーチャント(ストアの運営者)は非表示にはできますが、削除も並び替えもできません。
必須の要素に使います。blocks/にあるものだけが、テーマブロックです。
セクション内ブロックの定義は、引き続きセクション側のschemaに書きます。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。