Wednesday, March 13, 2013

Cara Mengganti Avatar OpenID pada Komentar

Beberapa bulan lalu saya pernah membagikan tips cara mengganti avatar anonim pada komentar blogspot. Di kesempatan ini saya akan membagikan cara untuk mengganti avatar openID pada komentar blog, caranya sama dengan mengganti avatar anonim pada komentar blogspot, yaitu dengan memanfaatkan jQuery untuk merubah avatar openID tersebut. Mungkin anda berminat unutk menggantinya karena bosan atau tidak suka dengan avatar openID bawaan dari blogspot.
Berikut langkah-langkah untuk penerapanya..
1. Login akun blogger anda masing-masing
2. Pada Dashboard pilih Template » Edit HTML
3. Pastikan sudah ada jQuery pada template anda.. biasanya berada dibawah kode </head>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

Itu merupakan kode jQuery, jika di template anda sudah terdapat kode jQuery tersebut maka tidak usah di pasang lagi atau anda juga bisa mengganti kode yang lama dengan kode yang versi terbarunya.
(tidak boleh terdapat kode jQuery.min lebih dari satu walaupun versinya berbeda-beda)
4. Kemudian letakkan kode berikut ini diatas kode </body>

<script>
// ganti gambar anonim
$("img[src='http://img1.blogblog.com/img/openid36-rounded.png']")
.attr('src', 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRO4vOTtKuC76dfez-h1V4rowDV1-JQcM4f3BVMVvmo0jCxQ22lB0pcRkwlU44JyqHP16lmCYuiUyYNsnkHizOcI1aMbIgGk2HRYUeVZXpNF9V2ZIi_8zNqdl_AbvUQJTidJLDA83u4-U/s1600/openid_logo.png')
.ssyby('blank')
</script>

Keterangan:
Ganti tulisan yang berwarna HIJAU dengan URL gambar anda atau anda juga bisa mencarinya di google.com.
4. Simpan Template dan liat pada komentar.
Semoga bermanfaat

Judul: Cara Mengganti Avatar OpenID pada Komentar; Ditulis oleh Unknown; Rating Blog: 5 dari 5

Cara buat Fitur Slide AccordionKarya baru lagi saya buat dan kupersembahkan untuk anda yang selalu setia mampir di blog ini. Widget ini saya beri nama Fitur Slide Accordion. Selain tampilan ... readmore
Membuat Thread Comment BertingkatMembuat Thread Comment Bertingkat - kali ini saya akan membahas tentang bagaimana cara memebuat agar Thread comment betingkat sepeti gambar diatas. kode CSS-n ... readmore
CSS BORDERBanyak sekali properti dari fitur css border, yang semuanya berfungsi mengatur tampilan gaya dan warna dari sebuah border. Berikut beberapa properti dari fitur css ... readmore
CSS TeksBeberapa fungsi fitur CSS teks atau disebut juga dengan format teks seperti warna teks, penempatan atau posisi teks mengunakan properti align, properti Dekorasi tek ... readmore
CSS DimensiFitur CSS Dimensi berfungsi untuk mengontrol tinggi dan lebar suatu elemen seperti gambar dan paragraf teks. Baik Mengatur tinggi dari suatu elemen dengan menggunak ... readmore