Cara Mudah Pasang Lazy Load di Blogspot Hanya 5 Menit

Animekume- Pada artikel kali ini saya akan membahas sedikit mengenai cara memasang lazyload untuk blog agar meningkatkan kecepatan loading blog saat di buka. Ada banyak sekali cara untuk memasangnya seperti memasang plugin Lazy Load.

Sumber : google.com

Maka dari itu pada hari ini animekume akan membagi salah satu tutorial untuk memasang Lazy Load dengan mudah dan cepat.

Maaf untuk kali ini kami belum bisa memberika demo untuk kalian yang ingin mencoba silahkan langsung di coba dan liat hasil akhirnya. Terimakasih.

Baca Juga



<script type='text/javascript'>
//<![CDATA[
// Lazy Load
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAQiOqlgHwG8Zh8Z7JOd6wMcTerCmfzoEGAvi6q9dsv8koI1IOVxf8MLP7U26VwXrRXFM8V_UTQw6KBwqAR4hJv38A_mzBUcLjgs-nxt-qf3hLGWeEvQFUUKWY5lcFPWqENotuNPj8n58P/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

Langkah-Langkah Memasang Lazy Load
1. Silahkan kalian buka Blogger kalian

2. Klik Template

3. Edit HTML

4. Tambahkan kode / script di atas tadi sebelum

5. Jika sudah di pasang sekarang silahkan lihat hasilnya apakah ada perubahan atau tidak

Jika tutorial di atas sudah berhasil namun masih saja loading blog tidak berubah silahkan kalian cek pagespeed blog kalian dan Compress gambar untuk meningkatkan loading blogmu. Terima kasih sudah berkunjung