ページをブログのようにサムネイル付きのグリッド一覧で表示する設定例です。テーマ本体のファイルを変更せず、カスタムLiquidブロックへのコード貼り付けだけで実装できます。表示順はコード先頭の設定変数で制御でき、指定したページを優先表示しつつ残りは名前順で並べることができます。
ページメタフィールドにサムネイル画像と除外フラグを定義しておくことで、各ページで個別に画像を設定したり一覧から非表示にしたりできます。
完成イメージ
ページ一覧ページにサムネイル付きのカードグリッドが表示されます。Horizonテーマの resource-card スタイルを活用しており、テーマのデザインと自然に馴染みます。
【設定方法①】メタフィールド定義の追加
Shopify管理画面の「設定 → カスタムデータ → ページ」から、以下の2つのメタフィールド定義を追加します。
◆ サムネイル（custom.thumb_nail）
タイプ: ファイル
◆ 一覧から除外（custom.excluded_from_list）
タイプ: 真または偽（ブーリアン）
【設定方法②】各ページのメタフィールドを設定
各ページの編集画面からメタフィールドの内容を設定します。サムネイル画像をアップロードし、一覧に表示したくないページは「一覧から除外」を True にします。
【設定方法③】テンプレート作成＆カスタムLiquid設定
テーマエディタで新規ページテンプレートを作成し、「カスタムLiquid」ブロックを追加してコードを貼り付けます。
コード先頭の priority_handles に優先表示したいページのhandleをカンマ区切りで指定すると、そのページが先頭に並び、残りは名前順で続きます。
Dawn版はこちら: ページをブログのようにサムネイル付き一覧で表示する設定例（Dawn）
