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

CSS BOX dan FungsinyaFitur Css Box digunakan pada saat kita membuat desain web termasuk mengatur tata letaknya. Css Box pada dasarnya adalah sebuah kotak yang membungkus elemen HTML, da ... readmore
Cara membuat slide dengan efek marqueeAnimasi slide foto atau gambar dengan menggunakan efek marquee, tidak kalah menarik bila dibanding dengan animasi flash. Selain lebih ringan, animasi slide ini dile ... readmore
Cara buat gallery dengan efek hover zoomingTambah lagi koleksi cara buat gallery. Berbeda dengan yang lalu, anda bisa lihat DISINI. Gallery yang ini lebih menarik dan cara kerjanya juga lebih enak dipandang. ... readmore
Percantik Tampilan Label Cloudmu Dengan CSS Permintaan sahabat blogger dalam bentuk komentar di salah satu postingan OOM RIO untuk meminta dibuatkan tutorialnnya. Kelebihan dari modifikasi widget ... readmore
CSS Border-RadiusFungsi Properti css border - radius memudahkan kita merubah sudut pada sebuah box atau kotak menjadi tumpul atau melengkung. Bahkan dengan properti css border - rad ... readmore