Hi Team,
We have a problem with the “Swatches” widgets/attributes not showing the images.
We have already found the reason is something to do with WP-Rocket not behaving as expected with Woodmart.
According to this documentation:
https://docs.wp-rocket.me/article/1141-using-lazyload-in-wp-rocket#background-images
An example of compatible markup:
<div style=”background-image: url(image.jpg)”>
The div element can have other attributes, classes, etc, it will still work.
The element will then be transformed into:
<div data-bg=”url(image.jpg)” class=”rocket-lazyload” style=””>
In our HTML in /shop we can see the following for all WOODMart Layered NAV widgets:
span style=”background-image: url(image.jpg)
And as the WP-Rocket documentation states – we can see it is transformed into this:
<span data-bg=”url(image.jpg)” style=”” class=””>Aladdin</span>
As you can see – the “class” is missing “rocket-lazyload” class which makes this background image never load.
In order to resolve the issue I have added the following “hotfix” provided by WP-Rocket to disable lazy-loading background images:
https://docs.wp-rocket.me/article/1144-disable-lazyload-on-background-images
But that’s only so our theme will not break in the meanwhile…
Our request is to have Woodmart compatible with WP-Rocket Lazyload for Background images (WOODMART Layered NAV Widget) – for some reason, Woodmart seems to prevent/overwrite/remove “rocket-lazyload” class?