-->
Mempercepat Loading Blog Dengan Memasang Lazy Load

Mempercepat Loading Blog Dengan Memasang Lazy Load

Mempercepat Loading Blog Dengan Memasang Lazy Load

Cara Memasang Lazy Load di Blogger - Banyak cara yang sanggup kita lakukan untuk mempercepat loading Blog menyerupai memasang script Compression Gambar.

Masih dalam satu topik yaitu mempercepat loading Blog, untuk mempercepat loading blog kali ini kita akan memakai Script jQuery Lazy Load. Dengan memasang Lazy Load tentunya sangat bermanfaat untuk Blog kita, mengapa? Karena loading Blog menjadi lebih ringan.


Membuat loading Blog menjadi lebih ringan merupakan salah satu yang di sarankan oleh Google, lantaran kalau loading Blog berat sanggup menciptakan pengunjung mengurungkan niatnya mengujungi blog kita dan pengunjung tersebut menutup halaman.

Tentunya itu sebuah kerugian, oleh alasannya itu untuk meringankan loding Blog, kita sanggup menggunakn Lazy Load untuk di pasangkan di Blog kita. Adapun caranya sebagai berikut :

1. Login ke akun Blogger
2. Pilih Template, Edit HTML
3. Selanjutnya kau cari arahan </body>, copy arahan di bawah ini dan pastekan diatasnya.

<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/AVvXsEjqfjghOqUZek1W2uH81OP8UfMzlQ848qmTAqEYeE_FN59v3p5vA5g7m_p5oCEpYuLlb21mLCKXO9LkG62HGDIvLgCSRUM-P6Lz1gHH3YH58rYz_51zazWSxVbfXkeztObSiHVr5V3qU6I/s1600/aakshare.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

4. Simpan template

Untuk mengecek kecepatan loading Blog kau sanggup memakai tools Google yakni PageSpeed Insights. Disana kau sanggup melihat strukur Blog kau apa yang perlu diperbaiki.

Sumber http://www.websiteedukasi.com/
Blogger
Disqus
Pilih Sistem Komentar

No comments

Advertiser