Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot

Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot
Template.Id - Sobat salah satu penyebab beratnya loading blog adalah besarnya ukuran gambar / image pada komentar. Walaupun sobat memperkecil dengan CSS, tetap saja ukuran asli avatar adalah 512x512px. 
Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot

Untuk mencobanya, silahkan klik kanan pada avatar komentar yang ada di blog sobat, kemudian klik kanan pada buka gambar di tab baru. Sebagai contoh, avatar saya sebelum saya rubah ukurannya seperti gambar ini :
Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot

Setelah di rubah, maka ukuran avatar berganti menjadi seperti ini :
Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot


Blogger mempunyai cara yang unik dalam menentukan ukuran gambar, untuk ukuran gambar asli biasanya ditandai denga kode s1600 pada URL gambar. Gambar yang sobat upload memiliki beberapa ukuran, dengan merubah ukurannya sobat bisa menentukan berapa pixel gambar yang akan di tampilkan. Sebagai contoh, avatar saya mempunyai URL :
http://lh4.googleusercontent.com/-H08EqbNhKPo/AAAAAAAAAAI/AAAAAAAAADs/jLmlB6cRb8s/s1600/photo.jpg
silahkan copy paste untuk mencoba, kemudian ganti s1600 menjadi s50 misalkan, gambar akan berubah menjadi 50x50px.
Selanjutnya,  merubah ukuran avatar yang tadinya 512px menjadi 65px

Cara Memperkecil Avatar Komentar

Sebagaimana dijelaskan di atas, cara memperkecilnya bukan dengan CSS, melainkan dengan JavaScript. Untuk memasangnya, simpan kode dibawah ini pada template sobat diatas </body>


<script type='text/javascript'>
//<![CDATA[
var avatar=$("#comments");
avatar.find('.avatar-image-container img').each(function() {
        var ava = $(this).attr('longdesc') ? $(this).attr('longdesc') : $(this).attr('src');
        $(this).show().attr('src', ava.replace(/\/s[0-9]+(\-c)?\//,"/s65-c/")).removeAttr('longdesc width height');
});
//]]>
</script>


Keterangan:


Ganti angka s65 sesuai ukuran avatar pada blog sobat.Setelah di save, coba kunjungi postingan yang sudah mempunyai komentar, kemudian buka gambarnya di tab baru. Berubah bukan?

Sekian artikel  Percepat Loading Komentar dengan Memperkecil Avatar di Blogger/Blogspot , silahklan di coba semoga berhasil. Sobat blogger, jangan lupa komentarnya ya :)

Comments

  1. keren mau coba gan . Http://seallinfo.blogspot.com/

    ReplyDelete
  2. nice info gan, mampir balik yach http://udhy-asbudi.blogspot.com/

    ReplyDelete
    Replies
    1. semoga bermamfaat :) ok saya kunjungi balik

      Delete
  3. Aji Pgg- Mampir dn follow blog saya jg y...

    ReplyDelete
  4. mampir aja, kalo soal gituan saya suka males hhhha neh bgt blogger males buat edit template mampir follow jg gan

    ReplyDelete
    Replies
    1. di coba aja gan, berani edit htmlnya biar bisa buat template sendiri :)

      Delete
  5. Saya Coba dulu mba gan,soalnya blog saya juga memuat agak banyak gambar.
    Thank's ya

    ReplyDelete
  6. pengen ntu punya blog yang loadingnya cepet.
    Makasih ude dishare sob.

    ReplyDelete
    Replies
    1. iya sama-sama sob,semoga tipsnya bermamfaat :-?

      Delete
  7. hehe mentap broo yg ini sy sudah lakukan di blogku

    ReplyDelete
  8. makasih gan, dengan tutor ini loading jauh lebih ringan

    ReplyDelete

Post a Comment

۝ Peraturan dalam berkomentar :

☛ UpsS,. Budayakan berkomentar sesudah membaca artikel sob.
☛ Dilarang Menghina, Promosi (Iklan), Menyelipkan Link Aktiv, dsb.
☛ Dilarang berkomentar berbau Porno, Spam, Sara, Politic, Profokasi.
☛ Berkomentarlah yang Sopan,Bijak, dan Sesuai Artikel (Dilarang OOT)
☛ Saya sangat berterima kasih atas semua yang mau berkomentar diblog saya.
☛ Saya PASTI akan berkunjung balik ke blog Sobat yang sudah mau berkomentar di sini.

☭ Copyright © 2014 - 2015 - Anaktimor17 Blog® by Markus Kono ✓

Popular posts from this blog

Contoh Surat Lamaran Kerja di Indomaret Terbaru 2018

Cara Melamar Kerja PT. Musashi Auto Parts Indonesia 2019

Cara Melamar Kerja di PT Astra Honda Motor Secara Online