Lazy load merupakan jquery yang perlu kita pasang supaya pemuatan gambar pada blog menjadi lebih cepat. Dalam beberapa kasus, banyak yang menggunakan javascript ini untuk mempercepat blognya pada hasil tes kecepatan di situs Pagespeed Insight.
Tapi, tahukah anda? Bahwa belum tentu situs anda menjadi lebih cepat, loh. Beberapa masalah bloger menyampaikan bahwa jquery ini tidak berfungsi sama sekali. Jikalau jquery ini tidak berfungsi, maka sanggup disimpulkan bahwa jquery ini akan memperlambat durasi pemuatan blog anda, loh.
Nah, ternyata oh ternyata, itu memang terjadi. Apabila aku tak salah, aku menggunakan template buatan mas Sugeng yang berjulukan “Blogku Blogger Template” dan aku memasang jquery ini pada blog berplatform blogspot ini. Saya melihat satu perbedaan mencolok pada ketika pemuatan blog ini. Apakah itu? Sesuai dengan namanya “lazy load”, gambar akan dimuat dengan cepat tetapi gambar akan muncul jikalau kita scroll ke bawah alias malas ditampilkan.
Saat aku melihat hasil di pagespeed insight juga kesannya menjadi lebih cepat. Maaf, aku tak sanggup menampilkan kesannya alasannya aku telah berganti template blog. Hehe... Sekali lagi mohon maaf.
Nah, selanjutnya aku mencoba pada template “Vikka Blogger Template” tanpa jquery library. Dan mengejutkan sekali hasilnya, sobat. Ternyata memang benar apa yang dikatakan para bloger itu, blog aku menjadi lebih lambat, pengaruh lazy load tidak terlihat, dan hasil dari Pagespeed Insight berkurang. Merugikan sekali bukan?
Tapi, tahukah anda? Bahwa belum tentu situs anda menjadi lebih cepat, loh. Beberapa masalah bloger menyampaikan bahwa jquery ini tidak berfungsi sama sekali. Jikalau jquery ini tidak berfungsi, maka sanggup disimpulkan bahwa jquery ini akan memperlambat durasi pemuatan blog anda, loh.
Nah, ternyata oh ternyata, itu memang terjadi. Apabila aku tak salah, aku menggunakan template buatan mas Sugeng yang berjulukan “Blogku Blogger Template” dan aku memasang jquery ini pada blog berplatform blogspot ini. Saya melihat satu perbedaan mencolok pada ketika pemuatan blog ini. Apakah itu? Sesuai dengan namanya “lazy load”, gambar akan dimuat dengan cepat tetapi gambar akan muncul jikalau kita scroll ke bawah alias malas ditampilkan.
Saat aku melihat hasil di pagespeed insight juga kesannya menjadi lebih cepat. Maaf, aku tak sanggup menampilkan kesannya alasannya aku telah berganti template blog. Hehe... Sekali lagi mohon maaf.
Nah, selanjutnya aku mencoba pada template “Vikka Blogger Template” tanpa jquery library. Dan mengejutkan sekali hasilnya, sobat. Ternyata memang benar apa yang dikatakan para bloger itu, blog aku menjadi lebih lambat, pengaruh lazy load tidak terlihat, dan hasil dari Pagespeed Insight berkurang. Merugikan sekali bukan?
Maka dari itu, sehabis pemasang javascript jquery ini, harap pribadi mengunjungi situs anda untuk mengetahui apakah jquery ini berjalan dengan lancar atau tidak. Kalau begitu, pribadi saja kita ke topik, berikut ini yaitu cara memasang jquery lazy load pada blog atau situs.
1. Buka sajian edit pada blog anda.
2. Cari instruksi </body>
3. Lihat, apakah ada instruksi <link href=’..’/> ?
4. Jikalau ada instruksi tersebut, maka pribadi masukkan javascript dibawah diatas instruksi tersebut. Jikalau tidak ada, maka masukkan instruksi ini sempurna di atas instruksi </body>
1. Buka sajian edit pada blog anda.
2. Cari instruksi </body>
3. Lihat, apakah ada instruksi <link href=’..’/> ?
4. Jikalau ada instruksi tersebut, maka pribadi masukkan javascript dibawah diatas instruksi tersebut. Jikalau tidak ada, maka masukkan instruksi ini sempurna di atas instruksi </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"
<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/AVvXsEgkQpQ8qQHswOm70l_If5gY9wLCfUAGhh2neEDfOkKH1WRllCCpWIebHzaVdxkdIw9Y_zWGUJ4O9Cwm6nYqwVfaJLGNuEfuePloMjbN1x6kpZfmJZf-AsV1ER5JnwMHzLbM5DU8vuhNQoQA/s640/arlinadesign.gif",effect:"fadeIn",threshold:"-50"})}); //]]> </script>
Sumber kode: Arlina Design5. Simpan template
6. Kunjungi blog anda
7. Jikalau pengaruh lazy load pada gambar muncul, maka “selamat anda berhasil”
8. Jikalau gagal, maka hapus instruksi tersebut dan simpan template.
9. Selesai.
Praktis bukan?
Kalau begitu, sekian pembahasan pada artikel kali ini. Terimakasih atas kunjungan anda dan hingga jumpa di artikel lainnya.
Related Posts
- Cara Memasang Meta Tag Pada Blogger Meta Tag merupakan bab penting dalam hal SEO pada blog. Blog takkan SEO sepenuhnya dengan hal ini. Seiring perkembangan juga, meta tag tel ...
- 30+ Trik Menciptakan Blog Super Cepat Lulus Pagespeed Dan Yslow Hai, teman Bloger! Kali ini saya akan membahas wacana pengalaman saya lagi sobat. Apa sih itu? Hal itu ialah mengenai saya yang sanggup memper ...
- Tukar Pulsa Ke Voucher Google Play Hai chief.. Apa kabar mungkin mimin jarang update blog.. Dan kali ini mimin mau update tentang Tukar pulsa ke voucher google play.. Top up. ...
- Cara Root Android Tanpa Pc Dengan Root Genius Mobile Root Android dengan Root Genius Mobile Download Root genius.apk, (Update) Instal apk Tekan pada bulat besar Root Proses root seg ...
- Team Build Buat Barbarq Hai chief Pernahkah kalian merasa kesal ketika melawan team yang kompak..? Ya memang kekompkan team merupakan salah satu langkah unt ...
- Cara Mengatasi Android Lemot Banget1. Hapus Cache Menjalankan aplikasi di Android akan meninggal sisa data penyimpanan berkelanjutan atau disebut cache, penumpukan cache dari aplikasi- ...