Shopify reduces image quality of image banner photo

Store Design
, , , , , , , , , , , , , ,

Topic summary

A user reports that Shopify is automatically reducing the image quality of their image banner. The issue appears related to Shopify’s default image optimization behavior.

Proposed Solutions:

  • Code modification approach: A PageFly representative suggests editing the image-banner.liquid file in the theme code editor (Online Stores > Themes > Edit code) and replacing specific markup code with provided alternatives.

  • Alternative fix: Another user mentions that Shopify uses the srcset attribute by default to reduce image quality across all images, suggesting adding JavaScript code to the theme.liquid file (at the end of the <head> tag) to remove this attribute.

Current Status:

The discussion remains ongoing. The original poster had difficulty locating the suggested code sections in their theme files, leading to private message exchanges with the PageFly representative. The issue relates to a separate banner configuration for mobile and desktop in Dawn 2.0 theme.

Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.
1

Hello, guys! For some reason shopify reduces the image quality of my image banner, can someone help me, please?

My site: https://fddd3f.myshopify.com/

Password: asd321

Link to photo: https://postimg.cc/xJZwqZPS/6ddb048d

2

Hi @kitchencrafted

This is Noah from PageFly - Shopify Page Builder App

Please help me to follow the steps below to fix this issue

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: go to image-banner.liquid and replace the code here:

PageFlyNoah_0-1691627755671.png
PageFlyNoah_0-1691627755671.png2458×1526 411 KB

By this code:

And here:

PageFlyNoah_2-1691627856174.png
PageFlyNoah_2-1691627856174.png2462×1464 436 KB

By this code:

Hope this can help you solve the issue

Best regards,

Noah | PageFly

3

Hi! Thanks for your reply. I don’t find these codes in my image-banner.liquid section

4

Can you help me by take a full screenshot in the image-banner file when you search for : {{ section.settings.image_2 please?

5

I messaged you on private

6

This is the issue im facing

https://community.shopify.com/c/shopify-design/separate-banner-mobile-and-desktop-dawn-2-0-adding-2nd-image-to/td-p/1478540

7

Hi, i have replied the private message, please help me check it

8

Shopify by default reduce the quality with “srcset” attributed in all img. Add this to remove it in your theme.liquid (at the send of html tag)