jQuery Lazy Load - Cara Ringankan Loading Image

Sebenarnya banyak cara untuk meringankan loading page blog. Mulai dari pemilihan widget, struktur halaman homepage bahkan sampai efisiensi isi template blog yang sobat miliki. Bagaimana dengan image dalam blog apakah loadingnya telah dibuat ringan? Inilah alternatifnya dengan memakai jQuery Lazy load - Cara ringankan loading image di blog sobat. Trik ini berguna bagi anda yang banyak menggunakan image di dalam blognya. Caranya mudah. Mau mencobanya silahkan baca lanjutan tutorial ini.

Lazy loader adalah plugin jQuery di mana efek lazy load akan menangguhkan proses loading bagi image yang terdapat pada blog. Efek Lazy load hanya akan berfungsi apabila page di scroll. Image selepas page yang di scroll akan terpapar dengan menggunakan efek jQuery Lazy Load.

Lazy Load membantu meringankan blog dengan mengurangi waktu masa proses loading page pada sebuah blog terutama pada blog yang banyak menampilkan image gambar ataupun image yang berukuran besar. Dimana gambar tersebut akan di-load saat mouse scroll diarahkan kebawah halaman page blog.

 
Cara memasang jQuery Lazy Load di blogspot, ikut beberapa langkah di bawah ini:

• Login Blogger Dashboard --> Design --> Add A Gadget --> HTML/Javascript.
• Copy paste kode di bawah ini pada content HTML/Javascript.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></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/AVvXsEgPKMDGsorCTCcF5-2JkY7UYTslkVLGOASBM4tL9n5zz7zZlh7Rvs_fK1eYU7JD1ZNASuzkW5aBnyhCzXeu0gyopWu6Pib6_KGYYasRdvhQbL_defOvi2k-EylFrMrl0Gw7jYRWttuaAyY/s1600/grey.gif"
 });
 });
 </script>

• klik Save.

Catatan :

• Bila tidak ada perubahan efek yang terjadi setelah kode di Save, coba pastekan kode tersebut sebelum atau di atas kode  </body>  pada script template sobat.
• Bila belum juga terjadi perubahan setelah kode tersebut di paste di atas atau sebelum kode </body> , coba dengan paste kode tersebut sebelum atau di atas kode</head>
• Perlu diketahui loading image berbentuk flash akan terlihat bergerak lambat karena efek ini. Trik ini hanya efektif untuk meringankan loading image untuk memudahkan pembukaan blog.

Semoga artikel singkat ini bisa bermanfaat bagi rekan-rekan. Salam persahabatan dari Admin Allien 99.. :)