FROM CACHE - jp_header

dawnにおける画像のぼやけについて

dawnにおける画像のぼやけについて

mio3
訪問者
1 0 1

テーマは【dawn】を使用しています。

 

画像バナー、スライドショー共にTOP画面で使用しています。その際、画像は1800×800で作成しているのですが、リサイズされるため、ぼやけてしまいます。上記のサイズ以上で作成してもぼやけてしまいます。スマホは別画像を表示できるようにしているのですが、同じくぼやけます。全体的に表示されている全ての画像(商品画像も)ぼやけても見えるのですが、何か対処法はございませんでしょうか?

 

Liquidにはshopifyではじめて触れ、今までコーディングもしたことはありません。知識も皆無ですが、指示通りの箇所にコードをコピーして入れることはできました。大変恐れ入りますが、ご助言いただけませんでしょうか?何卒よろしくお願い致します。

1件の返信1

株式会社フルバランス
Shopify Partner
1537 549 697

質問拝見しました。

おそらくアップロードするタイミングで画像の解像度が低いため、拡大表示してぼやけてしまうのかと思われます。

なので対応するセクションのファイル内の<image>タグの一部を修正する必要があります。

 

 

<img src="{{ product.featured_image | img_url: 'master' }}" alt="{{ product.title }}">

 

 

以上のように|の後の部分で、以下処理をさせます。

 | img_url: 'master':高解像度(元の解像度)の画像を取得します。

こうすることにより高画質のまま画像を挿入できるかと思います!

 

 

ご参考にしていただけますと幸いです。

なにかご質問があれば、お気軽にご相談ください。
お悩み解決できましたら、ベストアンサー、いいねいただけると励みになります。
何卒よろしくお願いします。

株式会社フルバランス

株式会社フルバランス(Shopify Experts)
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』 株式会社フルバランス