Yes! That worked
Thanks so much.
Topic summary
A Shopify store owner using the Dawn theme encountered blurry collection banner images on mobile devices, while desktop versions displayed correctly. Despite trying various image sizes and resolutions, the issue persisted.
Initial Solution Attempt:
- Adding CSS code to change
object-fittocontainfor mobile screens did not resolve the blurriness.
Successful Resolution:
- The fix involved editing the
main-collection-banner.liquidfile in the theme code. - Removing three specific lines that defined smaller image widths (165w, 360w, 535w) in the responsive image srcset solved the problem.
- This prevented Shopify from serving lower-resolution images on mobile devices.
Current Status:
- Original poster confirmed the solution worked successfully.
- A new user has joined the thread with a similar blurry mobile image issue on their homepage (not just collection banners), but the same code removal did not resolve their problem. They are awaiting further assistance.
1 Like