コレクション一覧のサムネイル画像を任意で設定したい

Highlighted
新規メンバー
2 0 0

コレクション一覧のサムネイルはメディアの最初のものになっていますが、
Wordpressのアイキャッチ画像のように任意に設定することは可能でしょうか。

0 件の「いいね!」
Highlighted
先駆者
152 50 155

使用されるテーマによって違いがあると思いますが、概ね以下の方法で変更可能だと思われます。

https://help.shopify.com/ja/manual/products/collections/collection-layout#part-73df83b2cbe007dd

上記方法がご要望を満たさない場合は以下のいずれかになります。

  • liquidファイルを編集して対応する
  • アプリで対応する

liquidファイルを編集して対応する場合、テーマごとに用意されているサポートサイトやフォーラム(英語などの他言語含む)にカスタマイズの実例が書かれている可能性もありますので、そちら探されると良いかもしれません。

 

Highlighted
新規メンバー
2 0 0

質問の書き方が悪く恐れ入ります!
コレクション一覧に表示される、各商品のサムネイル画像を設定したいという意図での質問でございます。(そのままだとメディアの1枚目になっております)
何卒よろしくお願いいたします。

0 件の「いいね!」
Highlighted
先駆者
152 50 155

こちらこそ記載内容が不足しており申し訳ありません。

使用されるテーマによって違いがあると思いますが、概ね以下の方法で変更可能だと思われます。

https://help.shopify.com/ja/manual/products/collections/collection-layout#part-73df83b2cbe007dd

テーマによっては、上記の「コレクションの記事のサムネイル」を設定することで、連動してコレクションの一覧の画像が変更されます。

参考URL: https://community.shopify.com/c/Shopify-Design/Debut-theme-Change-Collection-list-images/td-p/476238

 

「コレクションの記事のサムネイル」では変更できない場合、以下の方法などを検討する必要があると思います。

上記方法がご要望を満たさない場合は以下のいずれかになります。

liquidファイルを編集して対応する
アプリで対応する

なお、軽く探したところ該当するアプリが見つかりませんでしたので、liquidファイルを編集することになる可能性が高いかもしれません。

 

 

 

Highlighted
遊覧客
27 2 38

テーマによって画像の呼び出し方や条件の書き方が違うため、一概にこれが正解とは言えませんが、
既存のテーマの話ではなく、Liquidの話であればヒントを書きます。

まずはproductオブジェクトをJsonで出力してみてください。
これをみれば商品データの階層構造が分かるので、実現したいことへの理解が進むはずです。

 

{{ product | json }}

 

Jsonの構造に沿っていくとフューチャー画像が1つと、その他の画像のURLがあるはずです。
フューチャー画像はこう書くと出ます。

 

{{ product.featured_image }}

 

その他の画像が複数ある場合は、first、last、[n] でも選べます。
n値はメタフィールドで商品ごとに指定するほうが運用上使いやすいです。

 

{{ product.images.first }}

{{ product.images.last }}

{{ product.images[0] }}

{{ product.images[1] }}

{{ product.images[2] }}

 

 

Highlighted
遊覧客
20 7 17

Liquidでやる場合の別の方法もあります。(雑な回答ですいません)

1.各画像のaltに特殊文字(例:featured)を含む様にする

2.collections.liquidを編集します。

 1. 該当商品に表示する画像をforで探します

    2.altにfeaturedを含む画像を表示します

 

少し処理が重くなりますが、よくある方法なので、汎用性の面ではおすすめです。

0 件の「いいね!」