Use lazyload in picture tag

Hey there @makobaby01 thank you for reaching out

I was wondering if you have any other slider on your site? I ask this because the one on your homepage is in the view, this means that it will not be lazy loaded.

Regards,

Jorge

@wpmudevsupport15 I only have a slider on the main page, does it mean that if it is only on the main page there will be no lazy loading?

Wouldn’t there be a way for me to put it on? type a class to add in div and among others.

Hi @makobaby01

Are you using the Slick from scratch? if so, this library already provides a lazy loading feature:

// To use lazy loading, set a data-lazy attribute
// on your img tags and leave off the src

<img data-lazy="img/lazyfonz1.png"/>

$('.lazy').slick({
  lazyLoad: 'ondemand',
  slidesToShow: 3,
  slidesToScroll: 1
});

https://kenwheeler.github.io/slick/

Sometimes those libraries will prevent the lazy loading plugins to work, but we would need to run a quick test.

Could you let us know how you are adding the images? A regular HTML block or from PHP or using any plugin?

Best Regards
Patrick Freitas

I wear this on the head
<img data-lazy="https://makobaby.com.br/wp-content/uploads/2018/02/ajax-loader.gif"/>

And this in the footer

;(function($){
$(document).ready(function() {
    $('.carousel').slick({
		infinite: true,
    	dots: true,
		arrows:false,
   		autoplay: true,
		lazyLoad: 'ondemand',
    	autoplaySpeed: 6000,
  });
});	
})(jQuery);

I’m adding an image on the basis of the html, which in this case I use WPbakery, then I put HTML and inserted my HTML from the slider, adding the images

Hi @makobaby01,

Smush parses the page before it’s is displayed on DOM and Smush by default will only lazyload for images loaded via tags. I’m afraid there isn’t an easy workaround that could be suggested regarding such use case and would require custom coding.

What you could do is to use the inbuilt Slick lazyload as mentioned by Patrick in the previous reply and exclude the images from Smush Lazyload settings to avoid any conflicts.

Kind Regards,
Nithin

Hi @makobaby01

I hope you are doing well and safe!

We haven’t heard from you in a while, I’ll mark this thread as resolved.

Feel free to let us know if you have any additional question or problem.

Best Regards
Patrick Freitas