Shopifyのページに関するオブジェクト

Shopifyの商品ページでもブログページでもない「ページ」に関するオブジェクトに関するメモ。

「ページ」だけだとわかりにくいのですが、WPのように「固定ページ」という名称もないようなので、取り合えずページと記載しています。

概要

• The page object
  pageオブジェクト
• Liquid objectspagesオブジェクト

• ページ専用のpage.liquid内であればpageオブジェクトを使う
• それ以外のファイルではグローバルオブジェクトのpagesを使う
• 必ずしもループを作る必要はない

少々ややこしいですが、Page専用のpage.liquidであれば、pageオブジェクトが使えます。

それ以外ではpageオブジェクトが機能しないので、グローバルオブジェクトであるpagesオブジェクトにHandleを追加し、そのHandleの情報を直接呼び出します。

サンプル

{% comment %}Handleがtestの場合で、page.liquid以外のliquidファイルに記述する場合{% endcomment %}

{% comment %}Handleを直接記載することで、そのHandleのタイトルが表示される{% endcomment %}
{{ pages.test.title }}
{{ pages.test.metafields.hoge.fuga }}

{% comment %}以下の書き方であればハンドルに変数の代入が可能なので、assingなどで動的に動作させることが可能{% endcomment %}
{{ pages['test'].title }}
{{ pages['test'].metafields.hoge.fuga }}

ページのHandleの確認と変更方法

ページにはHandle(=URLでもあります)を設定する場所が一見すると見つかりません。

以下のページにあるように、投稿欄下部の検索エンジンでの見栄えを確認できる場所までスクロールし、Edit website SEO(日本語環境では「webサイトのSEOを編集する」)のように書かれたテキストリンクをクリックすることで 入力欄が表示されます。

• Solved: Re: How can I change the URL of a product page? – Shopify Community

結び

ページにもメタフィールド(カスタムフィールド)が作れるので、ページに付与されている情報はかなり便利に使える場合があります。

コレクションや商品ほど用途が定まっていないため、ストアに必要な機能を開発する際に利用するなども考えられますので。