MASIGNCLEAN101

Cara Memasang Lazy Load Di Blog Dengan Mudah

Cara Memasang Lazy Load Di Blog Dengan Mudah
February 17, 2019
Cara Memasang Lazy Load Di Blog Dengan Mudah
Cara Memasang Lazy Load

Cara Memasang Lazy Load Di Blog - Ada banyak sekali faktor yang mempengaruhi apakah sebuah blog akan berkembang baik kedepannya atau tidak. Mulai dari konten yang berkualitas, eksistensi si penulis, ide yang menarik, tampilan blog yang ramah bagi para user, dan termasuk salah satunya loading page yang lancar jaya. 

Meski tidak berpengaruh langsung pada optimasi search engine, loading halaman blog yang berat akan membuat kita kehilangan visitor yang semula berniat membaca di blog yang kita kelola. Kembalikan saja pada diri anda sendiri, apakah anda suka dengan blog yang lambat saat memuat? 

Oleh karena itu, pada kesempatan yang singkat ini, kita akan membahas mengenai cara memasang lazy load di blog dengan mudah. Yang dimana fungsi dari script lazy load ini adalah untuk meringankan loading halaman website yang kita kelola. Dari pada banyak basa basi langsung saja simak pembahasan dibawah ini.


Cara Memasang Lazy Load Di Blog Dengan Mudah


1. Copy script lazy load dibawah ini

 
<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:"http://1.bp.blogspot.com/-Qg5bi1ZtDdM/VZ5nHAyYBqI/AAAAAAAAChE/exGnasO4oyk/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>


2. Masuk kedalam dashboard blogger Tema Edit HTML


3. Cari kode </body> atau &lt;/body&gt; (gunakan CTRL + F) untuk pencarian lebih cepat.


4. Setelah ketemu kode </body> atau &lt;/body&gt; , Paste Script Lazy Load yang sudah kita copy, tepat diatas kode </body> atau &lt;/body&gt;


5. Langkah terakhir, Simpan. Dan lihat hasilnya.


Itulah tutorial singkat dan mudah dari kita mengenai cara memasang lazy load di blog. Semoga bermanfaat.


Judul : Cara Memasang Lazy Load Di Blog Dengan Mudah
Penulis : Admin
Tanggal : 16 Februari 2019
Hari : Sabtu
Di : Kota Medan
Watpedia

Seorang mantan guru yang banting setir ke dunia internet marketing. Pernah Mengajar Di : SD Jamilurrahman Jogjakarta dan SDIT Al Hanif Cilegon