SOLVED: Woocommerce Products Images show it pixelated

Bugs
1

Bricks Version: 1.4
Browser: Chrome 90
OS: macOS / Windows / Linux / etc.
URL: Aretes Encuentados con Cristales – My WordPress

Hello, when we enter in the single product page, the main image is displayed correctly, but the rest of the images are displayed pixelated.

image
image757×730 45.8 KB

2

Hi Saúl,
Thanks so much for your report!

I don’t see any visual difference between the first and all the other images (not even when I open them in full size in the browser), but I noticed that the file size for all the images is around 46KB, which is great for the loading time, but pretty low for the image quality at that size. I assume that you have compressed the images before or by a plugin, right?

If so, I would recommend you to set the compression not quite so high, so that as few artifacts as possible occur. Let me know if that solves your problem.

Best regards,
timmse

3

Hello,

I tried changin the images and adding more heavy images and is the same problem. You can see it on the page /producto/pendiente-arete-de-cuentas-azul-y-dorado/

The first image is correct, but the rest of the images are pixelated, being these originally in good resolution.

I am going to attach the second image so you can see that it is in good quality even if they do not weigh so much.

DSC02002
DSC020021440×1800 248 KB

Thank you very much!

4

Hi Saul,
the problem is definitely related to compression. The JPG you attached is 254KB, and the WebP on the website is 38KB. Comparing JPG to WebP is difficult, but the quality can only suffer from a file size reduction of over 500%.

Open the JPG and the WebP side by side in the browser… then you’ll see the artifacts too - and that has nothing to do with bricks, because we don’t change the images at all :wink:

5

Hello,

The problem is solved.

The imagenes are fine, it was simply entered in appearance/customize/woocommerce/product imeges, you can select the resolution with wich the images are displayed. By changing these values, the images are already displayed correctly. It was a problem with woocommerce.

I’ll leave it here in case it can help someone else.

Thank you for the help and speed.

All the best.