Cara Memasang Script Lazy Load di Blogger Dengan Mudah - Hallo sahabat blogger, pada tutorial kali ini saya akan membagikan tutorial cara memasang script lazy load di blogger dengan mudah. sudah banyak sekali faktor penyebab yang mempengaruhi kecepatan loading blog, seperti terlalu banyak widget dan gambar. bila loading blog anda ini sangat berat dan lama, maka blog anda akan kehilangan pengunjung, apalagi anda jarang update artikel lama-lama pengunjung anda akan terus berkurang setiap harinya.
Baca Juga : 5 Tips dan Cara Mudah Mendapatkan Sitelink Blog dari Google Terbaru
Baca Juga : 5 Tips dan Cara Mudah Mendapatkan Sitelink Blog dari Google Terbaru
 |
| Cara Memasang Script Lazy Load di Blogger Dengan Mudah |
Lazy Load adalah sebuah plugin atau script yang bisa kita terapkan pada situs web atau blog untuk mempercepat loading atau proses pemuatan objek gambar dan objek lainnya. Script Lazy Load ini berfungsi untuk menunda dalam proses pemuatan gambar pada halaman web atau blog. jadi gambar tersebut akan di muat ketika pengunjung men scroll pada halaman tersebut. oke kita langsung saja ke tutorialnya.
Berikut adalah Cara Memasang Script Lazy Load di Blogger Dengan Mudah :
- Masuk terlebih dahulu ke akun Blogger dan masuk menu Dashboard
- Pilih Tema atau Template > Edit HTML
- Kemudian cari kode </body> dengan menekan tombol CTRL dan F untuk memudahkan anda mencari kode tersebut
- Setelah itu silahkan anda copy Script Lazy Load di bawah ini dan letakan di atas kode </body>
(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/AVvXsEi611x7Dd2D53bz-O_LlQJS1ZkyJ05IcxPk2u7fuSsTCFLUYD_v3bTW_gUmX0l6CdXdU6pa0wUPHKZxUE1I3bGV3cXsVNe37OkH1BPWPXLhAICbU41nOqMADQC3EefSQV-VKltsXMK_PO-o/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
- Terakhir silahkan simpan tema atau template dan lihat hasilnya
Nah, Mungkin itu saja tutorial kali ini mengenai Cara Memasang Script Lazy Load di Blogger Dengan Mudah. jangan lupa tinggalkan komentar di bawah dan share ke media sosial anda, semoga bermanfaat.
2 komentar