[Smush Pro] Conflict with Master Slider plugin

We've discovered that there is an odd issue with Smush pro and Master Slider plugins; when Smush CDN is enabled.

The slider images are still served from our server, even though they are indeed in <img> tags and not CSS background images.

Also, when the Automtic Resizing option is enabled in Smush CDN, the images disappear from the slides and seem to have a max-width of 1px inlined for the sizes.

This was confirmed by Patrick during a live chat and attached screenshots are from his test site.

  • Adam Czajczyk

    Hi Miles

    I hope you're well today and thank you for reaching out to us.

    I did some more tests with Master Slider and it seems it's all related to how Master Slider is "building-up" these sliders.

    When you look into the browser console, you'll see that the main slider image is a regular HTML markup using a standard "img" tag so, theoretically, it should be served from CDN. Looking into a page source, however, reveals that... there's no markup for the main slider!

    There's only a "container" without any "img" tag and then, depending on the settings of a particular slider, you got an image/thumbnail list (e.g. displayed as a set of thumbnails).

    The Master Slider seems to be creating the "main slide" markup (including the main image img tag) dynamically, most likely it's injecting it to the DOM with jQuery script. This would mean that the image "is not really there" when the site is "generated" by WordPress core. jQuery (so JavaScript) works in browser - on user end - so Smush is not able to interact with it.

    That's about the "slide" itself. If it comes to resizing option - that'd also be related. The "image/thumbnails list" that's used by MasterSlider to then "build-up" actual slides - it does use "real" HTML, printing out images as "real" img tags. Therefore these images (if you look into the page source code) are served from CDN. But apparently there's no any indication of the container size and the target image container is "unknown". Basically, what happens is that smush does resize the images for these thumbnails to "unknown" sizes, then MasterSlider scripts use them to create actual slides. Furthermore, apparently if the resizing option is enabled the actual slide does use the CDN image (though incorrectly resized).

    I know this sounds complex but I'm afraid that's all caused by the "tricky" way MasterSlider uses jQuery scripts to build up slides/sliders. However, I have asked our developers for additional confirmation and to see if there's anything we could do to address this.

    Please stay tuned and we'll update you here as soon as we know more.

    Best regards,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.