Image sharpness drops after upload and again after PhotoSwipe zoom (WoodMart 8.6

Hello XTemos Support,

I’m seeing two separate drops in image sharpness on the MOEBE Rectangular Dining Table product page on NORMO. The three attached screenshots show the same photo in Chrome on Windows, with the table displayed at a comparable size:

Original file before upload: I opened the local file directly in Chrome. The edges of the tabletop and the wood grain look sharp.

Uploaded image opened directly: I opened the image served by the website in a separate Chrome tab, outside the product gallery. The edges and wood grain are already softer than in the local original.

Uploaded image after PhotoSwipe zoom: I opened the product gallery and clicked the magnifying glass in the top-right corner. The same details look softer again than they do in the separate Chrome tab.

The site is running WoodMart 8.6.6 with WoodMart Child active. LiteSpeed Cache is disabled, and I haven’t added any custom code to change the zoom level. I saw that WoodMart 8.6.5 included a fix for blurry PhotoSwipe images, but I still see the additional loss of sharpness after using the magnifier on 8.6.6.

Could you help me check both stages? Is there a setting that affects the sharpness of the file served after upload? And is there a fix for the additional blur after clicking the magnifier that lets me keep the PhotoSwipe gallery and its current zoom level?

The site is currently in Coming Soon mode. I can provide temporary access through Private content if needed.

Thank you,
NORMO

Attachments:

You must be logged in to view attached files.

Hello,

1. Sharpness of the uploaded file

WoodMart does not process or re-compress the files you upload. WordPress and WooCommerce create the image files when you upload them, along with any optimization plugin or hosting/CDN service you use. The usual reasons an uploaded image looks softer than the original are:

– Large image scaling: If the original is wider or taller than 2560px, WordPress makes a smaller copy and uses it instead. The file name of that copy ends in -scaled. You can check this in Media > Library by opening the image and comparing the file URL and dimensions with your local original.
– JPEG compression: WordPress compresses the image sizes it generates (by default, the quality is 82).
– Optimization plugins or hosting/CDN services: These can compress images further or convert them to WebP, for example, image optimization plugins or server-side image optimization.

The image sizes WooCommerce generates for the product page are set in Appearance > Customize > WooCommerce > Product Images. The “Main image width” should be at least as large as the size the image is shown at in the gallery. More details:
https://woocommerce.com/document/fixing-blurry-product-images/

2. Additional softness after clicking the magnifier (PhotoSwipe)

To check this properly, we need to see the product page and image setup on your site.

Kindly share your site’s WP-Admin login details so we can investigate the issue and assist you.

For your security, please don’t post your credentials directly in this topic. Instead, use our secure sharing service: https://secret.xtemos.com/

Enter your login details there, generate a secret link, and paste that link into the Private Content area of your reply. Please do not post the secret link in the public topic reply.

The secret link can only be opened once, so please generate a new one if it has already been accessed.

Once we have this, we’ll check which image file opens in the lightbox and whether it’s being shown larger than its actual size, and then let you know how to fix it while keeping the PhotoSwipe gallery.

Best Regards.

Thank you, that explains why WordPress generated a -scaled copy for the first upload. Our WooCommerce Main image width is already set to 1920 px.

Could you also look at point 2? The exact same WebP file used by PhotoSwipe looks sharper when opened directly in Chrome than after clicking the magnifier in the gallery, with the product displayed at a comparable size. Is there a fix for this additional loss of sharpness that lets us keep the PhotoSwipe gallery and its current zoom level? Thank you.

Hello,

It seems you forget to share the Admin URL and the normal URL of your site, Please share the URL as well, so that we will check further.

Best Regards,

Sure,

Hello,

Thank you for the detailed report. We checked both stages on your MOEBE Rectangular Dining Table page.

1. Sharpness loss after upload. Your original file is 1920×2636 px. Its long side is over 2560 px, so WordPress automatically created a resized and re-compressed copy, …-scaled.webp (1865×2560). The gallery shows that copy. To avoid this, re-upload the product images with the long side at 2560 px or less. WordPress will then serve your original file unchanged.

2. Extra blur after clicking the magnifier. This comes from how the bundled PhotoSwipe library positions the zoomed image. On Windows screens with display scaling set to 125% or 150%, the image can end up on a fraction of a screen pixel, and Chrome renders it slightly softer. It doesn’t depend on your site settings. We’ll investigate this further and look into a fix in a future WoodMart update.

Best Regards.

Thank you for you answer. We look forward to the update. We hope you can fix this for us.

regards,
Andreea

Hello,

You’re welcome, and thank you for your patience. We’ll look into a fix for the extra blur after the PhotoSwipe zoom in a future WoodMart update. Please keep your theme updated so you get it when it’s released.

If you need help with anything else, just let us know.

Best Regards.

[Author]

Posts