Cara memasang lazyload pada blogger

Cara membuat lazyload pada blogger - Kembali lagi bersama saya Addys , Banyak dari kita para blogger sangat terobsesi dengan memasang beberapa kode dan widget widget untuk menambah menarik website kita, alih alih untuk menambah kesan premium tetapi malah membuat loadpage website kita menjadi berat. itulah yang menjadi dasar membuat website kita sepi visitor ( pengunjung ) dan mengakibatkan website kita menurun di pencarian google.

Tenang, solusi terbaik yaitu mengurangi penambahan  widget ( gunakan seperlunya saja seperti popular posts dan label ) dan juga jangan menggunakan script Java  dan CSS berlebih pada website anda, gunakanlah gambar yang ukurannya kecil agar loading page website anda lebih cepat.


Bila solusi di atas belum juga memberikan peningkatan berarti maka gunakan lah Lazy script, Lazy script adalah  script khusus untuk meringankan beban saat loading website berlangsung. Membuat membuat blog yang tadinya berat menjadi ringan. Script ini bekerja agar gambar menjadi delay saat loadpage blog berlangsung. 




Berikut adalah cara memasang laxzload  pada blog


1. Login blogger.com > Template > Edit template 

2 . Letakan script lazyload di bawah ini di bagian atas </body>

<script type='text/javascript'>
//<![CDATA[
(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:"http://1.bp.blogspot.com/-Qg5bi1ZtDdM/VZ5nHAyYBqI/AAAAAAAAChE/exGnasO4oyk/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>

3. terakhir pilih simpan dan lihat hasilnya.

Bila anda kurang setuju dengan penambahan script lazyload ini anda bisa mudah untuk menghapusnya pada menu HTML, 

Sekian pembahasan kita kali ini semoga artikel ini bisa membantu anda yang sedang mengalami masalah tersebut.

0 Response to "Cara memasang lazyload pada blogger"

Post a Comment

Sampaikan kritik dan saran melalui menu komentar di bawah ini

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel