WebP Background-Image Replacement

Hi @tschoch, yes, our plugin is supporting background-image webp replacement if you turned ON Image WebP Replacement. You can send us your Report Number for checking.

Report number ZHRACABZ

Thanks!

I should also note, we are using background images in the page title bar of the Avada theme as well as Revolution Sliders where the slide image is a background-image. Those are the images we are not seeing be converted to webp. We did also check that the webp versions of the files are available on the site…

Just a quick update and FYI for Avada Theme users. In order for the CSS Combine, JS Combine, Minify etc to work properly I had to disable all optimizations under the performance tab in the Avada theme with the exception of lazy load of images. I’m using the lazy load for Avada as it seems more consistent.

By making these changes and purging cache, I also noticed that the Page Title Bar background images are now replacing with WebP. The only real outstanding issue I’m seeing is with replacement of the images in the Revolution Slider slides.

Any guidance you can provide there would be greatly appreciated.

Hi @tschoch, we find some of your images are using data-lazyload as the image source, please try to add data-lazyload Litespeed Setting > Media > WebP Attribute To Replace and purge to cache to see is it work.

Unfortunately that doesn’t see to have fixed it. I was able to get the

• tag to replace properly but the other areas of the slider are not updating. It looks like the path to the image is sprinkled all through the html for each slide.

Hi @tschoch, May I clarify you wish to replace the image on <img class="tp-kbimg"/>

(e.g. <img class="tp-kbimg" src="/wp-content/uploads/2019/03/Home_Office-GSI-3.jpg" style="position: absolute; height: 468px; width: 765px; transform: matrix3d(1.2, 0.00020944, 0, 0, -0.00020944, 1.2, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform-origin: 0% 0% 0px;" width="1600" height="978"> )

to webp version?

Also, there’s a mistake on my last comment, please try to add img.data-lazyload on WebP Attribute To Replace.

It appears that the update to the element.attribute setting worked. I think we are good!

• This reply was modified 5 years, 8 months ago by tschoch.