With the monosnap links where you can compare the difference between the original high quality images on my website with the poor quality image size filter images: How am I able to fix this to remove the image size filter that was applied by the theme?
The images in high quality look great, that's exactly how i want them to look. Do i need to fix something in the coding? Please help!
Thanks so much,
This is the worst part of Shopify if you ask me. As a web developer, I've spent a long time optimizing my images just the way I want, only to find that they are RECOMPRESSED when I upload them to Shopify. Not impressed!!! My clients' photos look like crap now! Please, at least make image compression optiona!!
Hi Tara @Tara_Sargent ,
Did you ever find a solution to this problem? I've had the same issue for 2 years and never seem to get reasonable support from Shopify on how to deal with it. Especially in our blogs, all of our high quality images are embarrassingly blurry. Thanks
I'm glad I found this forum - I must have spent days trying to fix this relatively simple highres/low res issue but to no avail. It may seem like an unimportant detail - but it is embarrassing to brands that want to present a professional look and feel. SHOPIFY please work with the customers on this problem - it seems that it was never resolved after a number of years. WHY??
I have definitely noticed the lack of quality. Very easy to notice on any text you include in an image, but that's easily remedied by placing your text in html instead, which is better practice anyway. But I can understand for those who don't have web developers to work with. For myself as a developer, having the option to add any image size you want to a picture on the CDN trumps any issues I have with the slightly lower quality of the images. This saves a lot of time from having to save out many different images which require just as many different links to reference. For instance we design our webpage for double resolution screens so instead of having to save out a picture for 2x res and normal res, we only need one picture and one path to the image with the "_1920x" before the file extension. This saves a lot of time. Also, I don't notice the issue much at all on mobile which is where a 80% our traffic comes from.
I recommend placing text and SVG Logos with HTML over your images if you can.
I had this problem as well. This is what I did to fix the issue. Hopefully this helps someone else in the future. Every time I would upload a photo using the insert image button it would add a smaller version of the higher resolution photo. As far as I can tell it wasn't theme related since I have the same problem with any theme I have used so far.
What I found out was happening was when I added a photo using the content editor it would make a smaller version of the photo I selected and create a new URL that was different from the actual photo I uploaded.
This is the image after adding it with the insert image button.
Here is how it looks on the site. (Too Small and blurry and it is a fixed size smaller than the uploaded size)
Here is how I fixed it.
From the content editor click "Show HTML"
Which will bring you to this. If you have a page with much more content you will need to find the "img src" tag.
Once you have found the image tag replace the URL link to the one you have uploaded into the files section. In my case it was lifestyle_3.jpg.
Replace the URL. In my example I left both so you can see the difference.
Keep in mind that both of these are the same image lifestyle_3. The content editor for whatever reason alters the size and points to the altered version rather than your original file.
You can also double click the image in the editor and it will bring up a modal, there's an image size option which I think is "Large" by default, you can click the dropdown and select original.
|an hour ago|
|2 hours ago|
|4 hours ago|
|4 hours ago|
|4 hours ago|