商品画像の下にバリエーション名を表示させたい

AI-generated summary

Shopifyの商品ページで、商品画像の下に各バリエーション名を動的に表示する方法が質問されています。現在はPhotoshopで画像自体に文字入れしており、運用の手間を減らしたい意図です。

  • 現状:
    • 商品にバリエーションを登録済み。
    • バリエーションボタンを押すと、対応する画像がスライド表示される仕組みになっている。
  • 相談内容:
    • この連動表示の仕組みを応用し、表示中の画像に対応するバリエーション名を画像下へ出したい。
    • 画像への直接文字入れをやめたい。
  • 補足:
    • サンプル商品ページURLが提示されている。

結論や具体的な実装方法はまだ示されておらず、回答待ちの状態です。テーマ編集やLiquid / JavaScriptによる連携が必要になる可能性がありますが、投稿本文内では未確定です。

●shopifyにバリエーションを登録している際に、画像の下にバリエーション名を表示させる方法を教えていただきたいです。

サンプルページ
https://tohokuru.jp/products/5-ya05-07

*現状は、画像にPhotoshopで直接文字入れをしております。
*バリエーションボタンをクリックすると、該当画像がスライドしてくるようになっています。

→こちらの仕組みを応用して、画像の下にバリエーション名を表示できたら、文字入れをしなくて良いため便利だと考えた次第です…

何か良い方法をご存知の方がいらっしゃいましたら、ご回答いただけますと幸いです。

よろししくお願いいたします。

1 Like