Product Gallery display problems only with Product with variations

Hi, it works.
The problem is that the site (to reduce loading time) uses webp images. It seem now it loads png.
what is strange is that before updating the time to the latest version, this problems didn’t happen.
It is possible tu set the ‘background:unset (or white)’ without loading png? or set it to webp as well?
Thanks.

Hello,

The PNG image is defined as a product image so there is such a CSS selector. https://prnt.sc/nEDc3k1o9BzF

You need to use some additional plugins to convert your images to webp, the theme does not provide such functionality.

Kind Regards

Hi,
ok, now i understand why I get this issue after updating the theme.
Infact, I not that thanks to you, that images are all png, while I’m using the plugin WebP Express . In the past every image were webP.

[supergap]

Webexpress is activated, I’ve checked.

• This reply was modified 1 year, 2 months ago by supergap.

Attachments:

You must be logged in to view attached files.

I found your post here: https://xtemos.com/docs-topic/update-6-0-explained/
perhaps why I can’t anymore use WebP in product pages as before. Also because Woodmart is an e-commerce theme, and most part of the site are product images.
Reading the article it seems there is a way to use them.
I copied and past this article here:

WEBP Images support

WEBP is a modern format for images that is recommended by Google. Using WEBP should increase your overall Google Pagespeed score as well. We have added compatibility for the WEBP image format provided by the Imagify plugin. Currently, it is fully supported and we use this plugin on our demo website as well. The only limitation is the single product page image gallery from WooCommerce. It is not possible to use WEBP there because it breaks default WooCommerce scripts for variable product images. We have also consulted with Imagify developers but it is not possible to solve this while using HTML tag. You can use an alternative “rewrite” method to serve WEBP images provided by the plugin. But this method has another drawback that it is not compatible with CDN services. Resources loading control Since our theme now loads a bunch of CSS and JS files instead of a single one, you might want to load or not load some particular files globally. So now you can add/remove any file using our performance options in Theme Settings -> Performance -> CSS & JS. For example, you can enable OWL Carousel library to be loaded globally or styles for it.

Thanks

Hello,

The “Alternative method” is using the “rewrite” method (it is an option in the Imagify plugin), but as described above, it is not compatible with CDN services. More details for what is CDN are here: https://xtemos.com/wordpress-performance-optimization-the-ultimate-guide-in-2021/#Step_5

Thank you for your time.

Kind Regards

[Author]

Posts