Cara Cepat Memasang Lazy Load di Blog

Baca Juga

Cara Memasang lazy load sangaah mudah, agan pasti pernah mengunjungi blog atau situs web yang sangat lambat, padahal koneksi internet agan masih stabil. Pasti agan merasa resah dan ingin buru buru untuk menutup blog itu dan mencari informasi di blog lainnya. Hal ini pasti sangat tidak menguntungkan bagi para blogger atau publisher, dikarenakan akan mengurangi visitor maupun penghasilan. nah untuk mencegahnya agan perlu memasang lazy load di blog

Cara Kerja Lazy Load

Gambar tidak akan dimuat jika tidak dilihat, hal ini sangat menguntungkan bagi para reader maupun visitor, sehingga tidak akan memakan internet lebih banyak dan pembaca lebih nyaman untuk membaca tentunya. Hal ini juga menguntungkan bagi para blogger karena mendapatkan reader yang merasa nyaman.

Cara Memasang Lazy Load

• Masuk ke blogger > tema > edit HTML

• Lalu salin kode dibawah ini, dan letakkan diatas tag </body>

<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/AVvXsEjwbCrB-NoUG3m6EwH527K1pDvcGeeLhIvaCTAPlohWsCcYRkIYdzebbvdeqwHzvCgad8bNL-RHYsA81SZJW5L9Puhrvyc_vG3L0XQu-V5TkODplojmukjMujgXMO3iMTkT51_z7sm4jYE/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

• Jika sudah kemudian agan simpan template, dan rasakan perubahannya.

Demikian cara memasang script lazy load untuk mempercepat loading blog. Semoga artikel yang saya tulis ini bermanfaat dan mempercepat loading blog agan.