Hey,
I’ve been having this issue with product images being blurry on the collection page. I have not been able to find a fix that works on where on here.
Website: Wholesome Boy
Examples:
Thanks,
Justin
This is Noah from PageFly - Shopify Page Builder App
You can check the image divide setting in the product card file of the dawn theme
Step 1: Online Stores > Themes > More Actions > Edit code
Step 2: click on product-cart and following this
And then change these lines (there are a couple of them in that file:
sizes="(min-width: {{ settings.page_width }}px) {{ settings.page_width | minus: 130 | divided_by: 1 }
Basically, just change “divided_by: 4” to “divided_by: 1”
Hope this can help you solve the issue
Best regards,
Noah | PageFly
6 Likes
“product-cart” is not an option on Dawn 9.0.0
Anyone reading this thread, you must follow Noah’s steps, but look for “card-product.liquid” instead.
2 Likes
Hello @WholesomeBoy ,
You can try to follow these steps:
Go to Online Store → Themes → Actions → Edit code
Go to Assets folder → collection-template.liquid file (or something name similar to this)
Look for this code
To display the image at its original resolution, modify the code to use the src attribute directly instead of using the img_url filter. Replace the existing code with the following:
Save and preview
Hope this can help. Let us know if you need any further support.
Ali Reviews team.
I edited that line from 4 to 1 and my images are still blurry. Am i missing something?
This worked brilliantly. Thanks!!
I literally only ran a search in the card-product.liquid file for “divided” in my admin code editor, found the couple of instances dividing by four, changed the 4 to a 1 on each and voila!! Worked like a charm! No more blurry images on featured-collection section in Dawn 11.0.0!!
1 Like
Hello, thank you very much. This worked for me as well. But the second picture when i hover over the product is still blurry. Do you know a way to fix that?
Did exactly the same … it’s like magic 
Hi Noah,
This fixed my desktop view, thanks! I noticed on my mobile view that I’m running into the same issue with the images on the product page being blurry. Do you have a fix for this?
Thank you for the solution! I was wondering if you know how to improve the image quality for the main product page image?
You are amazing, thank you so much!! I tried so many other forums for this issue, and yours was the one that worked. RT what WholesomeBoy said below, instead of searching for “product-cart” in the Edit Code, look for “card-product.liquid” in the Snippits dropdown, and I believe I just had to change 2 lines of code.
Can Confirm. This works perfectly.