Tutorial : Ringankan Blog dengan Lazyload Image Script


Morning peeps! Macam dah lama pulak Fiza tak buat tutorial kan.Banyak permintaan yang Fiza tak dapat tunaikan.Maaflah tak sempat Fiza nak buat tutorial yang korang request tu.Agak takde mase nak buat tutor lagi lagi yang ada print screen tu.Tapi kalau ada yang simple Fiza terus bagi tau korang je,ada yang Fiza dah reply kan.

Tapi tutorial ni hanya copy paste  dan telah diubah suai cara Fiza. Share untuk korang guna jugak.Semua ada masalah blog berat,lambat loading kan.Fiza pun mengalami masalah yang sama. Itupun setelah bermacam macam widget Fiza buang. Fiza detect satu satu widget yang berat. Yang berat tu Fiza buang terus. Tak de la semak sangat kan. Selain buang widget tak penting, template blog kena friendly users jugak. Kalau blog yang jenis banyak gambar tu elok sangatlah guna lazyload script.

Apa itu Lazyload script ni? Lazyload script ni akan mengurangkan loading images dalam blog korang .Image akan loading bila korang scroll ke bawah dahulu.Baru full image keluar. Automatically,ini akan mengurangkan loading blog.Blog akan jadi lebih cepat loading sebab image akan loading bila scroll je .Menarik kan?. Dah ada solutionnya apa tunggu lagi.Jom tambahkan Lazyload script ni dalam blog.

1. Log in account Blogger
1. Automatically akan ke window dashboard >> Template >> Edit HTML
2. Cari code </head> [untuk memudahkan pencarian tekan cltrl+F serentak dan masukkan code </head> didalam search box]
3. Copy kod ni dan pastekan sebelum kod </head> yang korang cari tadi .
<script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script> <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script> <script type="text/javascript" charset="utf-8"> var $j = jQuery.noConflict(); $j(function() { if (navigator.platform == "iPad" || navigator.platform == "iPhone") return; $j("img").lazyload({ placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif", effect: "fadeIn", }); }); </script>
4. Preview template.
5. Kalau nampak perubahan kelajuan loading blog,save.

Okay,simple je kan. Jangan lupa apply masuk dalam blog korang ye..Takde la jenuh nak tunggu blog loading.Blog akan jadi mesra alam gitu.

credit to : Blogger afiqahadzan 

20 comments:

  1. WAH...bagus nie fiza...takdelah orang terus tekan pangkah kalau lambat sangat nak loading blog kita kan...

    ReplyDelete
  2. wah, terima kasih... inila yang saya cari-cari selama ini... nak sebut/google tak tau panggil apa.. hehe.. thanks fiza.. menjadi..

    ReplyDelete
  3. ok nanti try. lama tak kelebek koding..

    stg silap nayaaa..huhu

    ReplyDelete
  4. nice sharing.. tapi tak pandai nk ubah2 ni.. huhu

    ReplyDelete
    Replies
    1. Boleh cuba dulu. kot kot menjadi :)
      Tak cuba tak tahu.

      Delete
  5. thnx tw share fiza. nanti hana nak try. hik2.

    ReplyDelete
  6. salam sis. sy ikut tuto ni jugak hihi

    ReplyDelete

Segala komen-komen yang telah disiarkan adalah tanggungjawab sepenuhnya ke atas penulis itu sendiri.
Pemilik blog tidak akan bertanggungjawab jika berlaku sebarang permasalahan berkaitan dengan komen yang disiarkan.
Mana-mana komen yang berbentuk iklan, mengandungi link/url, mengandungi kata-kata maki hamun atau tidak menyenangkan tidak akan disiarkan.
Begitu juga dengan unknown profile. Harap Maklum. Sekian Terima kasih.

Powered by Blogger.