商品詳細の商品画像にバリエーションの画像を表示させない。

AI-generated summary

商品詳細ページの画像スライダーで、バリエーションに紐づく画像だけを非表示にしたいという相談。Liquidのループで product.media をそのまま出力しているため、バリエーション画像も含まれて表示されてしまう状況。

提案:product.media[0].preview_image などインデックス指定で特定の画像のみを表示する方法が提示。任意の画像を選択表示する方向性だが、バリエーション画像のみを除外する具体的な条件分岐は示されていない。

技術用語の補足:product.media は商品に紐づくメディア(画像・動画など)の配列。preview_image はそのプレビュー画像を指す。Debut は Shopify の標準テーマの一つ。

現状の結論:明確な解決策は未提示。バリエーション画像の判別・除外条件の実装(例:メディアとバリエーションの関連を識別するロジック)の検討が今後の課題。

補足:コードスニペット(Liquid)の内容が理解に重要。議論は継続中で、追加の具体例や条件式の共有が求められる。

{% for media in product.media %}
  
    
   

{% endfor %}

商品のスライダー画像を取得した際に商品ページで設定したバリエーションの画像のみ非表示にすることは可能なのでしょうか。上記記述だとバリエーションの画像も一緒に表示されてしまいます。

使用テーマは Debutです。

Hdm 様

はじめまして。

株式会社フルバランスのドウケと申します。

一案ではございますが、

上記のコードですと、product.mediaに入っている画像情報を一つずつimgタグに渡している状況かと思います。

product.media[0].preview_image などにより特定の画像のみ表示できないでしょうか。

ご参考になれば幸いです