Shopify Liquidの「render」タグにおける引数と渡り値を分かりやすく解説します。「buy_buttons」スニペットを例に「block」「product」「product_form_id」「section_id」「show_pickup_availability」の役割と、省略した場合に起こる不具合まで整理。テーマ修正やカスタマイズ時に役立つ知識です。
以前の記事「【Shopify Liquid】スニペットファイルを呼び出す「render」 引数と渡り値とは？」では、render タグの基本的な仕組みについてご紹介しました。
また「render」を使ってスニペットファイルを呼び出す際には、いくつかのルールがあり、その後ろに続く「引数」と「渡り値」についても簡単に解説しました。
しかし、実際にテーマのテンプレートファイルで用いられている「render」の記述は、より複雑なケースが多い‥変数のスコープや複数の値の受け渡しなど、理解していないとつまずきやすいポイントが含まれているのです。
この記事では、そうした複雑に見える「引数」と「渡り値」が実際にどのような役割を果たしているのかを、具体例を交えながら分かりやすく説明していきます。
実際の使い方を見てみよう！
Shopifyのテーマ商品ページ（product.jsonから参照される product.liquidなど）では、購入ボタンを表示するために次のような記述がよく使われています。
{%- render 'buy-buttons',
block: block,
product: product,
product_form_id: product_form_id,
section_id: section.id,
show_pickup_availability: true
-%}この一文は「buy-buttons」というスニペットを呼び出している「render」構文です。つまり、購入ボタンに関するHTMLやフォーム、そして在庫確認やピックアップ可否といった要素をまとめた「コンポーネント」を外部のファイルとして切り出し、読み込んでいるのです。
Shopifyテーマでは、このようにUIのパーツ（エレメント／コンポーネント）をスニペット化し、「render」で呼び出すのが一般的な構成になります。コードの再利用性や管理のしやすさが高まるだけでなく、テーマ全体で一貫した構造を保つことができます。
冒頭で紹介した以前の記事でも触れましたが、「render」に続けて記述する各「引数」と「渡り値」は、呼び出し元(例えば、product.liquid)からスニペットファイル(例えば、buy-button.liquid)へ「このデータを使ってね」と明示的に受け渡す仲介役です。
呼び出し元で保持しているオブジェクトや変数を、そのままスニペット内で再利用することはできません。必ず「引数（左側）」と「渡り値（右側）」をセットで書くことで、スニペット内で使用可能になる仕組みになっています。
各引数と渡り値の役割
商品ページの render ‘buy-buttons’ で指定されている引数は、次のように理解できます。
block: block
・役割：呼び出し元「product.liquid」の{% for block in section.blocks %}の中で登場する{% when 'buy_buttons' %}ブロック。つまり「buy_buttons」ブロック自体の情報をスニペットに渡している。
・なかった場合：ダイナミックボタン（例：「今すぐ購入」）が表示されない、もしくは機能しなくなる。
product: product
・役割：シンプルに言えば「現在表示している商品オブジェクト」。{{ product.title }} や {{ product.price }} など、商品情報を扱うために渡している。
・なかった場合：商品情報や選択したバリエーションが正しくカートやチェックアウトページに渡らない。
product_form_id: product_form_id
・役割：購入フォームを特定するためのID。カートに商品を追加する複数のform>タグに紐づき、正しく購入データを渡すために必要。
・なかった場合：購入フォーム自体が表示されない、もしくは表示されても機能しない。
section_id: section.id
・役割：「buy_buttons」が属しているセクションのID。多くの場合はデフォルトの「商品情報」セクションを指し、どのセクションから呼び出されたかを識別できる。
・なかった場合：セクションのCSSが崩れたり、JavaScriptが動作しなかったりする。他のスニペットと干渉する恐れもある。
show_pickup_availability: true
・役割：店頭受け取り（ピックアップ）の可否を制御する真偽値。「true」なら「店舗での受け取り可否」を表示し、「false」なら非表示。
・なかった場合：ピックアップ可否の情報がチェックアウトに渡らず、ユーザーに誤解を与える可能性がある。
以上、実際テーマのテンプレートファイルで使用される、Shopify Liquid「render」と引数・渡り値の基本解説でした。
本記事でご紹介したのは、商品ページにおける「buy_buttons」の一部の引数と渡り値に過ぎません。
他にもテーマによっては異なる引数や渡り値が用意されている場合がありますが、それぞれの変数の意味を押さえておけば、ある程度は読み解くことができると思います。
特に、テーマ開発そのものを行う場面よりも、既存テーマの修正やカスタマイズを行う際に役立つ知識になると思いますので、ぜひご活用いただければ幸いです。
