[NSFW] WEBP source alter HTML

Hello! Great plugin, thanks! This plugin is good for PageSpeed insights, but only with WEBP express, for example. All webp practices must to use alter HTML for best compatibility. PhotoSwipe do not can use picture element with source image.

If we use alter html – we have not just img tag, but picture with source and img elements. If we click on thumbnail, the main image will not change. It happens because changes only img src, but not srcset of source.

If somebody have this issue, you can add this JS:

jQuery( ".thumbnails li" ).on( "click", function() {
    var correctImagePath = jQuery('.woocommerce-main-image img').attr('src');
    jQuery('.woocommerce-main-image source').attr("srcset", correctImagePath);
});

With this plugin and WEBP images we can have maximum of PageSpeed