Liquid Snippets by ALSEL
📘 公式リファレンス📦 リファレンス/オブジェクト初級

page_image オブジェクト

現在のページ(商品、コレクション、ブログ記事)のフィーチャー画像を表すオブジェクト。フィーチャー画像がない場合は、管理画面で設定した SNS シェア用画像を参照する。

用途
検索エンジンやソーシャルメディアのプレビュー表示用に、`og:image` メタタグを Liquid で出力するとき。テーマにこのタグがなければ、Shopify が自動的に page_image を使って Open Graph タグを生成する。
設置場所
theme.liquid の `<head>` 内のメタタグセクションで、`{{ page_image | img_url: 'width' }}` のように参照して `<meta property="og:image" content="...">` に格納する。または商品ページ・ブログページの共通メタ情報レンダリング部で活用する。
注意点
page_image は image 型のオブジェクトで、プロパティは返却されず、そのまま img_url フィルターで URL 変換してメタタグに埋め込む。商品・コレクション・ブログ記事以外のページ、または画像が設定されていないページでは自動的に SNS シェア画像(管理画面で別途設定)にフォールバック。テーマが og:image タグを出力しない場合、Shopify が自動生成する og:image:width / og:image:height にも対応しているため、カスタムメタタグ実装時はこれらも併記するとよい。
タグ:page-imagemeta-tagopen-graphog-imagesocial-sharing

仕様

27 行 / json
{
  "access": {
    "global": true,
    "parents": [],
    "template": []
  },
  "deprecated": false,
  "deprecation_reason": "",
  "description": "The resource's featured image for product and collection pages, and blog posts, is used. For all other pages, or pages where\nthere's no featured image, the [social sharing image](https://help.shopify.com/manual/online-store/images/showing-social-media-thumbnail-images?#setting-the-social-sharing-image-in-your-admin)\nis used.\n\n### Open Graph fallback tags\n\nThe `page_image` object can be used for creating [Open Graph](https://ogp.me/) `og:image` meta tags.\n\nIf a theme doesn't include `og:image` tags for a page, then Shopify automatically generates the following tags using the\n`page_image` object:\n\n- `og:image`\n- `og:image:secure_url`\n- `og:image:width`\n- `og:image:height`",
  "properties": [],
  "summary": "An image to be shown in search engine listings and social media previews for the current page.",
  "name": "page_image",
  "examples": [],
  "json_data": {
    "path": "",
    "handle": "",
    "data_from_file": ""
  },
  "return_type": [
    {
      "type": "image",
      "name": "",
      "description": "",
      "array_value": ""
    }
  ]
}

出典・ライセンス

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