Lazy Loader adalah plugin jQuery di mana efek lazy load akan menangguhkan proses loading bagi image yang terdapat pada blog.Cek berat Web/blogmu disini, Efek Lazy load hanya akan berfungsi apabila page di scroll. Image sesudah page yang di scroll akan terlihat dengan menggunakan efek jQuery Lazy Load. Untuk melihat Demo, silahkan klik di sini.
Lazy Load membantu meringankan blog dengan mengurangkan tempoh masa proses loading page pada sesebuah blog terutama pada blog yang banyak menampilkan image gambar ataupun image yang berukuran besar.
Untuk memasang jQuery Lazy Load di blogspot, ikut beberapa langkah di bawah.
Langkah 1
Login Blogger Dashboard --> Design --> Add A Gadget --> HTML/Javascript.
Copy dan paste kode di bawah pada content HTML/Javascript :
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGUoGdvGpdkW2YoxJ7TEF9x3QxCQpdFIyjh8ivY5mWbwRmFHzMNKJ5olQ9a8AUEC10y8hKTBnZ9Z-VFfXaTylYkJ8BfV9FYYIFXpbLGobdEGhZF2JfOj2LKSU7-7Az-XyRoZKxX347Dao/s1600/grey.gif"
});
});
</script>
<script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGUoGdvGpdkW2YoxJ7TEF9x3QxCQpdFIyjh8ivY5mWbwRmFHzMNKJ5olQ9a8AUEC10y8hKTBnZ9Z-VFfXaTylYkJ8BfV9FYYIFXpbLGobdEGhZF2JfOj2LKSU7-7Az-XyRoZKxX347Dao/s1600/grey.gif"
});
});
</script>
Terakhir, klik save
Pesan:
1.Jika tidak ada apapun efek terjadi setelah kode di Save, silahkan paste kode
1.Jika tidak ada apapun efek terjadi setelah kode di Save, silahkan paste kode
tersebut sebelum atau di atas kode </ body> pada script template.
2.Jika tidak ada seberang perubahan setelah kode di paste di atas atau sebelum kode </ body>, silahkan paste kode tersebut sebelum atau di atas kode </ head>
Artikel Terkait:
Blogger
- Cara Copy Paste Artikel Yang tidak bisa di Copy di Sebuah Blog ataupun Website
- Kenapa Blogspot.com berubah menjadi .co.id ‐ apa penyebabnya dan bagaimana mengatasinya?
- Cara Membuat Slideshow Pada Blogger
- Cara membuat chat box di blog & macam-macam chat box
- Cara Membuat Chat Box di Blogger
- Cara memasang radio online di blog
- CARA MEMBUAT RADIO STREAMING
- Membangun Radio Internet dengan Listen2MyRadio.Com
- Membangun Sendiri Radio Internet
- Radio Online
- Tampilan Baru Dasbor Blogger.com
- Membuat Label untuk Artikel Miniatur Hover
- Menambah Button Send ke Facebook
- Laporan berita sekilas dari w3spy.net
- Pengaturan Ukuran pada Kolom Komentar dan Postingan Lebih Fleksibel
- Membuat Web Hosting di Google Sites
- Google Code - Cara Membuat File Hosting di Google Code
- Tips Mendapatkan Banyak Follower di Twitter
- Membuat Artikel Terkait dengan Disertai Thumbnails
- Cara Merubah Blogger.com atau Draft.blogger.com Sebagai Default Dasbor Blogspot Anda
- Cara Memasang Widget SMS Gratis pada Blogger Blogspot
- Favicon Fitur Baru dari Blogger
- Menambahkan Gadget di Header
- Cara Membuat Menu dan Iklan Floating Bottom - Trik Menu dan Iklan Selalu ada di Layar
- Cara Membuat Iklan Melayang - Agar Iklan Tampil Setiap Halaman Blog Dikunjungi
Tidak ada komentar:
Posting Komentar