Cara Memasang Lazy Load |
Cara Memasang Lazy Load Di Blog - Ada berbagai faktor yang menghipnotis apakah sebuah blog akan berkembang baik kedepannya atau tidak. Mulai dari konten yang berkualitas, eksistensi si penulis, inspirasi yang menarik, tampilan blog yang ramah bagi para user, dan termasuk salah satunya loading page yang lancar jaya.
Meski tidak besar lengan berkuasa eksklusif pada meningkatkan secara optimal search engine, loading halaman blog yang berat akan menciptakan 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 ketika memuat?
Oleh alasannya yaitu 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 yaitu untuk meringankan loading halaman website yang kita kelola. Dari pada banyak basa busuk eksklusif 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:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9KE7Cj_oNcGwPNlp49acEbAnPG2VI20hNDe7Djqxm01DRfHu62YhZzNDhJIMHUU5qoLpfdMU-LB0EZ3oO_CXXanbblYKljwkO60DMHXRAUX_MfMD9ZMC_Ag5TCNjiszh6jKyQHr84DyK-/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})}); //]]> </script>
2. Masuk kedalam dashboard blogger ⇒ Tema ⇒ Edit HTML
3. Cari aba-aba </body> atau </body> (gunakan CTRL + F) untuk pencarian lebih cepat.
4. Setelah ketemu aba-aba </body> atau </body> , Paste Script Lazy Load yang sudah kita copy, sempurna diatas aba-aba </body> atau </body>
5. Langkah terakhir, Simpan. Dan lihat hasilnya.
Itulah tutorial singkat dan gampang dari kita mengenai cara memasang lazy load di blog. Semoga bermanfaat.
Cara Memasang Lazy Load Di Blog Dengan Mudah
Infoterlengkap.com
16 Februari 2019
Sabtu
Advertisement