media オブジェクト
商品に紐付いた画像、動画、3D モデル、外部動画を統一的に扱う抽象オブジェクト。id、media_type、preview_image、alt などのプロパティを持ち、メディアフィルターと組み合わせて URL 生成や表示を行う。
仕様
147 行 / json{
"access": {
"global": false,
"parents": [
{
"object": "product",
"property": "media"
},
{
"object": "product",
"property": "featured_media"
},
{
"object": "variant",
"property": "featured_media"
},
{
"object": "remote_product",
"property": "featured_media"
}
],
"template": []
},
"deprecated": false,
"deprecation_reason": "",
"description": "The `media` object can be returned by the [`product.media` array](/docs/api/liquid/objects/product#product-media) or a\n[`file_reference` metafield](/apps/metafields/types).\n\nYou can use [media filters](/docs/api/liquid/filters/media-filters) to generate URLs and media displays. To learn about how\nto use media in your theme, refer to [Support product media](/themes/product-merchandising/media/support-media).\n\n> Note:\n> Each media type has unique properties in addition to the general `media` properties. To learn about these\n> additional properties, refer to the reference for each type.",
"properties": [
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "number",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The ID of the media.",
"name": "id"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "If the source is a [`file_reference` metafield](/apps/metafields/types), then `nil` is returned.",
"examples": [],
"return_type": [
{
"type": "number",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The position of the media in the [`product.media` array](/docs/api/liquid/objects/product#product-media).",
"name": "position"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [
{
"name": "Filter for media of a specific type",
"description": "You can use the `media_type` property with the [`where` filter](/docs/api/liquid/filters/where) to filter the [`product.media` array](/docs/api/liquid/objects/product#product-media) for all media of a desired type.\n",
"syntax": "",
"path": "/products/snake-venom",
"raw_liquid": "{% assign images = product.media | where: 'media_type', 'image' %}\n\n{% for image in images %}\n {{- image | image_url: width: 300 | image_tag }}\n{% endfor %}",
"parameter": false,
"display_type": "text",
"show_data_tab": true
}
],
"return_type": [
{
"type": "string",
"name": "image",
"description": "",
"array_value": ""
},
{
"type": "string",
"name": "model",
"description": "",
"array_value": ""
},
{
"type": "string",
"name": "video",
"description": "",
"array_value": ""
},
{
"type": "string",
"name": "external_video",
"description": "",
"array_value": ""
}
],
"summary": "The media type.",
"name": "media_type"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "> Note:\n> Preview images don't have an ID attribute.",
"examples": [],
"return_type": [
{
"type": "image",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "A preview image of the media.",
"name": "preview_image"
},
{
"deprecated": false,
"deprecation_reason": "",
"description": "",
"examples": [],
"return_type": [
{
"type": "string",
"name": "",
"description": "",
"array_value": ""
}
],
"summary": "The alt text of the media.",
"name": "alt"
}
],
"summary": "An abstract media object that can represent the following object types:\n\n- [`image`](/docs/api/liquid/objects/image)\n- [`model`](/docs/api/liquid/objects/model)\n- [`video`](/docs/api/liquid/objects/video)\n- [`external_video`](/docs/api/liquid/objects/external_video)",
"name": "media",
"examples": [],
"json_data": {
"path": "/products/dandelion-milk",
"handle": "product.media[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> タグ内に埋め込む必須要素。
metaobjects オブジェクト
ストア全体のメタオブジェクト定義にアクセスするグローバルオブジェクト。個別のメタオブジェクトはタイプとハンドルで参照でき、メタオブジェクト定義のエントリをループで反復処理できる。
additional_checkout_buttons オブジェクト
PayPal Express Checkout など、オフサイト決済に対応した外部決済プロバイダーがストアに設定されているかを真偽値で返す。`content_for_additional_checkout_buttons` と組み合わせて、該当するチェックアウトボタンを条件付きで表示する。
canonical_url オブジェクト
現在のページの正規 URL を取得するオブジェクト。Google などの検索エンジンに対してどのページ版が正規であるかを指定するために使用する。
content_for_index オブジェクト
ホームページに表示するセクションの内容を動的に返すオブジェクト。Liquid インデックステンプレートで必ず使用する。
content_for_additional_checkout_buttons オブジェクト
PayPal、Apple Pay、Google Pay など複数の決済プロバイダが有効になっているとき、その決済ボタンを HTML として出力するオブジェクト。`additional_checkout_buttons` で有無を判定したうえで、このオブジェクトで実際のボタンを表示する。