設定タイプ②:メディア・リソース・色・リンク
リソースピッカー系の設定が返すオブジェクトを理解し、画像・商品・コレクション・色・フォントを設定から取り出せる
最終確認: 2026-09
解説
受託の現場でなぜ必要か: この回では、画像・商品・コレクション・色・フォントなどの設定が返す値の形を知り、設定から安全に取り出せるようになります。
受託では「画像を選んだのに表示されない」「商品を選ばないとページが壊れる」という事故を、この回の2つの決まりで防げます。
リソース系の設定は、文字列ではなくオブジェクトが返る
image_pickerはimage、productはproduct、collectionはcollectionのオブジェクト(値のまとまり)が返ります。product_list / collection_listは配列で、limitは最大50です。blog / article / page / link_list / metaobject / metaobject_listも同じくオブジェクトです。
ハンドルの文字列ではありません。
未設定のときはnilになるので、必ず空チェックをしてから使います。
リンク・動画・フォントの受け取り方
urlは内部・外部のリンクで、文字列が返ります。videoはストアにアップロードした動画で、video_tagで出します。video_urlはYouTubeやVimeoのURLで、acceptで許可する配信元を指定します。font_pickerはfontオブジェクトを返し、defaultが必須です。font_faceで@font-faceを出力し、font_modifyで太さや斜体の派生を作ります。
色の設定は4系統ある
colorは単色で、colorオブジェクトが返ります。color_backgroundはグラデーションなどのCSS背景値で、文字列です。color_schemeはsettings_schemaのcolor_scheme_groupと対になる配色セットです。color_paletteは2026-06に追加された方式です(Horizon 4.0が採用)。
テーマ全体で1つの色グリッドを編集し、各colorのdefaultがパレットを参照します。
発展:運用者がストアを壊せる設定
htmlは生のHTMLをそのまま出す設定です。liquidはLiquidをその場で実行する設定で、50KBまで、sectionやsettingsは参照できません。
どちらも運用者がストアを壊せるので、受託では原則使いません。
必要ならinfoに警告を書きます。
※ ShopifyはShopify Inc.の商標です。本サイトは個人が制作した非公式の学習教材であり、同社の承認・提携・後援を受けていません。記載内容は2026-09時点のものです。料金・上限値・管理画面のラベルは変わるため、作業の前に公式ドキュメントで確認してください。