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 membuat gambar melayangCara membuat gambar melayang menggunakan properti float, properti float sangat sering digunakan untuk gambar. Dengan Properti float, sebuah gambar bisa dibuat melay ... readmore
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 membuat efek shadow pada kotak dan gambar Penggunaan css3 memang menajubkan. Css3 merupakan pengembangan dari css 1 dan css 2. Keunggulan CSS3 memiliki banyak fitur. seperti shadow, transparansi, gradiasi ... 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
CSS3 TransisiSetelah yang lalu kita belajar tentang Transformasi 2D, kemudian agar lebih menarik kita tambahkan dengan efek transisi. Dengan CSS3 transisi, kita dapat menambahka ... readmore