リクエストからページが描画されるまで
URLからページが組み上がる順序を説明し、表示の問題をどの層で調べるか判断できる
最終確認: 2026-09
解説
受託の現場でなぜ必要か： この回では、URLからページが組み上がるまでの順番を説明できるようになります。
受託では「項目が出ない」と言われたとき、どの層を見るかを先に当てられると、調査が数分で終わります。
使われるテンプレートは、URLで決まる
ページの種類は、URLで決まります。/products/xxxなら商品（product）、/collections/xxxならコレクション（collection）です。/pages/xxxなら、固定ページ（page）のテンプレートが使われます。
個別の商品にカスタムテンプレートを割り当てていれば、product.landing.jsonのような別のファイルが使われます。
ページは、外枠から部品へと入れ子で組み上がる
描画の順番は、テンプレート → レイアウト → セクション → ブロック → スニペットです。
JSONテンプレートに並ぶセクションが、layout/theme.liquidのcontent_for_layoutの位置に描画されます。
各セクションは、自分のブロックとスニペット（再利用する小さな部品）を描画します。
この入れ子が、テーマの全ページに共通する構造です。
テーマエディタのプレビューも、同じ経路でShopifyのサーバーが描画したものです。
Liquidは、サーバーで1回だけ動く
Liquid（Shopifyのテンプレート言語）は、サーバーで1回だけ実行されます。
ブラウザに届くのは、完成したHTMLです。
ブラウザのJavaScriptからLiquidは呼べず、ユーザーの操作で再実行もされません。
「ボタンを押したらLiquidで再計算する」はできません。
動きのある部分は、JavaScriptとAjax APIで作ります。
「表示されない」は、上の層から順に調べる
「表示されない」と言われたら、調べる順番を決めておきます。
①テンプレートの割り当て → ②セクションがテンプレートに入っているか → ③セクション内の条件分岐 → ④データ（管理画面の値）の順です。
上から順に確かめると、当たりが早く付きます。
次は、この順番で手元のテーマの商品ページを追ってみましょう。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。