テーマアプリ拡張を作る
マーチャントがテーマエディタから追加できるアプリブロック/アプリ埋め込みを作れる
最終確認: 2026-09
解説
受託の現場でなぜ必要か: この回では、マーチャントがテーマエディタから追加できるアプリブロック/アプリ埋め込みを作れるようになります。
受託では、アプリのUIをストアフロントに出すとき、テーマを書き換えずに済むテーマアプリ拡張が唯一の正しい道です。
テーマアプリ拡張とは、テーマを書き換えずにUIを足す仕組み
extensions/<name>/にblocks/ assets/ snippets/ locales/とshopify.extension.toml(type = "theme")を持ちます。
テーマとは独立して配布・更新されます。
テーマを差し替えても残り、アプリを消せば消えます。
ブロックの中身は普通のLiquidなので、テーマ開発の知識がそのまま使えます。
アプリブロックとアプリ埋め込みブロックの違い
アプリブロックはblocks/*.liquidの{% schema %}で"target": "section"とし、マーチャントがセクションの中に置きます。
設定は{{ block.settings.x }}で読みます。
商品はproduct型の設定に"autofill": trueを付けると、置かれたセクションの商品が自動で入ります。
アプリ埋め込みブロックは"target": "body"(またはhead / compliance_head)です。
テーマ設定の「アプリ埋め込み」でONにすると、ページ全体に差し込まれます(チャットウィジェット・計測タグ向け)。
動的なデータはどう渡すのか
静的な値なら設定値で渡します。
ストアごとのデータならアプリ所有のメタフィールドに入れます。
リアルタイムの値ならアプリプロキシ(/apps/<subpath> → 自サーバー)で取りに行きます。
発展:上限がある
拡張全体の容量・ブロック数・Liquidの合計サイズには上限があります(強制)。
CSSとJSには圧縮後の推奨値もあります。shopify app buildで検査できます。
数値は公式で確認します。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。