📘 公式リファレンス📦 リファレンス/オブジェクト中級
product_option_value オブジェクト
商品のオプション値(色なら「赤」、サイズなら「M」)を表すオブジェクト。選択状態、在庫可能性、関連バリアントを参照できる。
用途
商品詳細ページでバリアント選択肢(カラースウォッチ、サイズ選択肢)をレンダリングするとき。選択可能な組み合わせを制御し、在庫なしの選択肢をグレーアウトさせるのに使う。
設置場所
Liquid テンプレート内で `{{ product.options_with_values[0].values[0].name }}` または `{{ variant.options[0] }}` の形で参照する。バリアント選択肢のループ内で `product_option_value.selected`、`product_option_value.available`、`product_option_value.variant` などのプロパティにアクセスする。
注意点
`available` プロパティは前後のオプション選択状態に依存して動的に変わるため、複数オプション商品では選択順序を考慮した UI 設計が必要。`swatch` プロパティはカラーまたはイメージが管理画面で設定されていない場合 `nil` を返すため、スウォッチ表示前に存在確認が必須。`product_url` は同じオプション値を持つ別商品が存在する場合のみ URL を返し、通常は `nil` となる。
仕様
142 行 / json{
"access": {
"global": false,
"parents": [
{
"object": "product_option",
"property": "values"
},
{
"object": "variant",
"property": "options"
}
],
"template": []
},
"deprecated": false,
"deprecation_reason": "",
"description": "",
"properties": [
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "number",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The ID of the product option value.",
"name": "id"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "string",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The name of the product option value.",
"name": "name"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "swatch",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "Returns a [swatch](/docs/api/liquid/objects/swatch) drop for the product option value. If there is no saved `color` or `image` content for the swatch, then the return value is `nil`.",
"name": "swatch"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "boolean",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "Whether or not the option value is selected.",
"name": "selected"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "In the context of the selected values for previous options, indicates whether the current option value has any purchaseable combinations in any subsequent options, or whether the current option value is purchaseable if there are no subsequent options.\nFor example, if a product comes in Color/Size/Material and Red/Small/Cotton is selected, `available` will indicate:\n- Color: Whether any variants for the Color option value are available for purchase.\n- Size: Whether any variants for Color:Red and the Size option value are available for purchase.\n- Material: Whether any variants for Color:Red, Size:Small, and the Material option value are available for purchase.",
"examples": [],
"return_type": [
{
"type": "boolean",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "Whether or not the option value is available.",
"name": "available"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "If this option value is selected (`selected == true`), this returns the `selected_or_first_available_variant`.\n\nIf this option value is not selected (`selected == false`), this returns the variant that is associated with the current\noption value and the other currently selected option values.\n\nUsing optionValue.variant is the recommended way to render product option values availability.\nFor more information, refer to [rendering option value availability.](https://shopify.dev/docs/storefronts/themes/product-merchandising/variants/support-high-variant-products#option-value-availability)",
"examples": [],
"return_type": [
{
"type": "variant",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The variant associated with this option value combined with the other currently selected option values, if one exists.",
"name": "variant"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "```liquid\n/products/gorgeous-wooden-computer\n```",
"examples": [],
"return_type": [
{
"type": "string",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "Returns a URL if the option value may be associated with another product, nil otherwise.",
"name": "product_url"
}
],
"summary": "A product option value, such as \"red\" for the option \"color\".",
"name": "product_option_value",
"examples": [],
"json_data": {
"path": "/products/mana-potion",
"handle": "product.options_with_values[0].values[0]",
"data_from_file": ""
},
"return_type": []
}出典・ライセンス
- Repository:
- https://github.com/Shopify/theme-liquid-docs
- License:
- MIT
このコードは Shopify 著作の MIT ライセンスソースです。 原本の著作権は Shopify が保有します。日本語訳は ALSEL によるものです。
関連項目
📘 公式リファレンス📦 リファレンス/オブジェクト初級
content_for_header オブジェクト
Shopify が必要とするスクリプト(分析・チェックアウト・言語設定など)をすべて動的に出力するオブジェクト。theme.liquid の <head> タグ内に埋め込む必須要素。
📁 theme-liquid-docs·MIT·20 行
📘 公式リファレンス📦 リファレンス/オブジェクト中級
metaobjects オブジェクト
ストア全体のメタオブジェクト定義にアクセスするグローバルオブジェクト。個別のメタオブジェクトはタイプとハンドルで参照でき、メタオブジェクト定義のエントリをループで反復処理できる。
📁 theme-liquid-docs·MIT·20 行
📘 公式リファレンス📦 リファレンス/オブジェクト初級
additional_checkout_buttons オブジェクト
PayPal Express Checkout など、オフサイト決済に対応した外部決済プロバイダーがストアに設定されているかを真偽値で返す。`content_for_additional_checkout_buttons` と組み合わせて、該当するチェックアウトボタンを条件付きで表示する。
📁 theme-liquid-docs·MIT·27 行
📘 公式リファレンス📦 リファレンス/オブジェクト初級
canonical_url オブジェクト
現在のページの正規 URL を取得するオブジェクト。Google などの検索エンジンに対してどのページ版が正規であるかを指定するために使用する。
📁 theme-liquid-docs·MIT·27 行
📘 公式リファレンス📦 リファレンス/オブジェクト初級
content_for_index オブジェクト
ホームページに表示するセクションの内容を動的に返すオブジェクト。Liquid インデックステンプレートで必ず使用する。
📁 theme-liquid-docs·MIT·27 行
📘 公式リファレンス📦 リファレンス/オブジェクト初級
content_for_additional_checkout_buttons オブジェクト
PayPal、Apple Pay、Google Pay など複数の決済プロバイダが有効になっているとき、その決済ボタンを HTML として出力するオブジェクト。`additional_checkout_buttons` で有無を判定したうえで、このオブジェクトで実際のボタンを表示する。
📁 theme-liquid-docs·MIT·27 行