テーマDawnを利用しております。
現在商品一覧ページには、各商品につき、商品画像・商品名・税込金額が表示されています。
これを、各商品につき、商品画像・SKU・商品名・税込金額となるようにしたいのですが、どのように対応したらよいでしょうか。
ご教授よろしくお願いいたします。
初めまして。該当の商品がバリエーションの設定をしていない場合は
下記コードをliquidに追記すれば可能かと存じます。
SKU: {{ product.variants.first.sku }}
skuは商品のバリエーションがそれぞれ持っているので
１つ目のバリエーションのskuを表示するだけなら上記で問題ないのですが
（バリエーションの設定をしていない場合でも内部的には１つのバリエーションを持っている）
バリエーションを複数持っている場合で、選択されたバリエーションに対して
動的に表示を変更したい場合は別途 js での実装が必要になります。
1 Like
ご回答くださいましてありがとうございます。
バリエーションを複数登録することはせず、単一のバリエーションでのSKU表示をしたく考えておりました。
ご回答にありますコードは、どのLiquidのどのあたりに追記したらよいのでしょうか。
全くの素人のため、大変初歩的な質問をお尋ねしてしまい恐縮ではございますが、ご教授くださいますとありがたいです。
main-product.liquid の {%- when ‘title’ -%} の上あたりに追記すれば良いかと思います。
また、テンプレートのカスタマイズページにて
「ブロックを追加」→ 「カスタムliquid」を選択
カスタムリキッドという項目が追加されるので、クリック
フォームの中にコードを入れれば、テーマブロックのように扱うこともできます。
1 Like
早速ご回答くださいましてありがとうございました。
教えてくださった内容で修正してみます！
以前こちらでご回答いただいた件、記載のとおり対応してみましたが、商品詳細画面にSKUがでてしまい、商品一覧画面にはSKUが表示されませんでした。
いろいろ調べたところ、以下の記事が見つかりました。
わたしがやりたいことは以下の投稿の内容だったのですが、main-product.liquidではなく、product-card.liquidの編集することとなっています。
この投稿にある内容はテーマDawnでも有効なのでしょうか。
https://community.shopify.com/c/shopify-design/add-sku-to-collection-page/m-p/1337978
もしこの回答はテーマDawnでも有効な場合、上記投稿に対する回答のコードは、具体的にどの部分に挿入すべきものなのでしょうか。
いろいろやってみましたが、なかなか商品一覧画面に反映させることができませんでした。
大変お手数ではございますが、再度ご教授くださいますと幸いです。
状況把握いたしました。
ご提示いただきましたURLのコードでは上手く表示できなかったのですが、
下記コードの場合、Dawnでも表示することができました。
SKU: {{ card_product.variants.first.sku }}
card-product.liquid の 138行目にある
の中に
挿入すれば表示できるかと思います。
ご回答くださいましてありがとうございました。
早速試したところ、実現できました。
丁寧に教えてくださいましてありがとうございました！