← inaro.devShopify学習ツール
06-07

ブロック②:テーマブロック

テーマブロックの仕組み(独立ファイル・再利用・ネスト)を説明し、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に書きます。

ステップ1 / 2

ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。