Pasti masalah ini sering berlaku kepada blogger yang terlalu banyak gambar dan juga widget pada blog mereka.
Jadi macam mana untuk meringankan blog anda? di sini sehinggit kongsikan satu plugin ataupun script Lazy Load yang ditulis meggunakan JavaScript.
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. Untuk melihat Demo, boleh lihat blog sehinggit sendiri yang telah terpasang dengan plugin ini.
Lazy Load membantu meringankan blog dengan mengurangkan tempoh masa proses loading page pada sesebuah blog terutama pada blog yang banyak memaparkan image gambar ataupun image yang bersaiz 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 kod di bawah 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='http://javscript-code.googlecode.com/files/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: "http://3.bp.blogspot.com/_LZtXSNcp76A/THkEtEOZfrI/AAAAAAAABRo/IARVMD_8TwA/s1600/grey.gif"
});
});
</script>
Dan akhir sekali sila klik save.
Perhatian
- Jika tiada sebarang efek berlaku selepas kod di Save, sila paste kod tersebut sebelum atau di atas kod </body> pada script template.
- Jika tiada seberang perubahan selepas kod di paste di atas atau sebelum kod </body>, sila paste kod tersebut sebelum atau di atas kod </head>
Kredit untuk script dan tutorial sepenuhnya kepada maribinablog
0 comments:
Post a Comment