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

Modifikasi Tampilan Pesan KomentarMemodifikasi tampilan pesan formulir komentar, mungkin bagi anda yag bosan dengan tampilan pesan komentar yang biasa-biasa saja karena tidak ada warna background at ... readmore
Cara buat menu navigasi Slide OutMasih terus memperbanyak jumlah koleksi menu navigasi. Menu ini bukan termasuk jenis drop down melainkan hanya sekedar navigasi biasa. Tapi menu ini memiliki kelebi ... readmore
Thread Comments Stylish dengan CSS Modifikasi Thread Comments Blogger Dengan CSS, ini pernah saya bahas dan kali ini saya akan membagikan yang versi duanya yang lebih stylish yang kebetulan saya ... readmore
CSS PaddingProperti CSS padding berfungsi untuk mengatur jarak antara elemen dengan isi elemen, misalnya mengatur posisi teks yang ada didalam border, tabel dll. Seperti ... readmore
CSS MarginProperti CSS margin berfungsi untuk mengatur jarak atau membuat ruang kosong, baik bagian kanan, kiri, atas, dan bawah disekitar elemen seperti box, teks, gambar dl ... readmore