 |
| Lazy Load Script |
Blogger.id - Hello sobat blogger kali ini admin akan membagikan tutorial seputar Script Lazy Loading di blogger dan disini saya akan menjelaskan apa itu Lazy Load, Fungsi Lazy Load dan Bagaimana cara membuat script lazy loading di blogger.
Script Lazy Loading adalah salah satu JQUERY yang biasa digunakan untuk membuat penundaan gambar dibalik layar sebelum terjadi aktivitas aktif saat itu, atau istilah lainnya membuat gambar tidak akan terbuka sebelum di scroll oleh seseorang yang melihat gambar anda.
Banyak manfaat yang bisa kita dapatkan dengan memasang Script berikut ini di situs blog anda. Salah satunya adalah meningkatkan kecepatan loading, meningkatkan SERP artikel anda di google penelusuran dan
juga memberikan pengalaman yang lebih baik lagi kepada pengunjung anda.
Cara Memasang Script Lazy Loading
Berikut ini adalah cara - cara membuat, menerapkan dan memasang Script Lazy Loading di Blog anda. Sebagai pemberitahuan script ini adalah reupload dari situs Blog Arlina Desain.
- Buka dashboard blogger.com
- Selanjutnya klik theme, lalu klik edit HTML.
- Berikutnya cari kode (</body>), untuk memudahkannya gunakan CTRL + F atau sebagai acuan biasanya Tag Penutup diatas ada dibawah sendiri.
- Selanjutnya Copy dan Paste Script Lazy Load tepat diatas Tag Penutup (</body>).
<script type='text/javascript'>
//<;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/AVvXsEjCBbIv_4EmYkLaXkUQUJCfEWOx2-Qi38WfOf1-tE1V0Q-uHzr63KEg64jn8vSDmO91a6MbmNib8ICCc36xGdkuFmgtXE23yFKZV9Hy15BYKuvF7Kkh2yw3_9PKg4JNQrGJY-jmNQOypFpY/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})});
//]]>
</script>- Terakhir Klik Save Theme, dan anda bisa melihat demonya sendiri diblog anda
Akhir Kata dan Penutup
Demikian adalah tutorial singkat cara memasang script JQUERY Lazy Loading di Blogspot anda, selanjutnya jika ada kesalahan saat memasang Script diatas silahkan tanyakan di kolom komentar dibawah ini, Semoga artikel ini bermanfaat bagi anda.
