Default Blogger Comment Avatar

Masih dalam rangka HUT Blogger ke 10, Blogger menambahkan fitur baru untuk penggunanya yaitu Blogger Comment Avatar. Ini berarti kita dapat menampilkan foto pada kolom komentar tentu saja jika menuliskan komentar (kalau nggak nulis ya nggak ketampil ^_^ ). Untuk memakai fitur ini pertama-tama setting di bagian komentar:

1. Dasbor
2. Setting/Pengaturan
3. Comment/Komentar
4. Show Image/Tampilkan Gambar
5. Save/Simpan

Sekarang ikuti langkah-langkah berikut ini:

1. Dasbor > Layout > Edit HTML
2. Centang Sxpand Template widget
3. Sebaiknya Anda Backup dulu template sebelum mulai pengeditan
4. Cari kode berikut ini:
   

   <dl expr:class='data:post.avatarIndentClass' id='comments-block'>

   Kalau tidak ketemu coba cari kode ini:
   

   <dl id='comments-block'>

5. Kemudian ganti kode tadi dengan kode di bawah ini:
   

   <dl expr:class='data:post.avatarIndentClass' id='comments-block'>

6. Oke, kalau sudah cari kode berikut:
   

   <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>

   kalau tidak ada coba kode berikut ini:
   

   <a expr:href='data:comment.authorUrl'><data:comment.author/></a>

7. Gantikan dengan kode di bawah ini:
   

   <b:if cond='data:comment.favicon'>
   <img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
   </b:if>
   <a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
   <b:if cond='data:blog.enabledCommentProfileImages'>
   <div expr:class='data:comment.avatarContainerClass'>
   <data:comment.authorAvatarImage/>
   </div>
   </b:if>

8. Simpan Template

Untuk tampilan yang tidak ada profilnya, anda bisa tambahkan kode CSS berikut ini di atas kode ]]></b:skin>

.avatar-image-container {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjpVXis62PZQb4pPl_0E6rFRNrkyPt3jFtrbQZBp-9tHnCG_ImEKq3NpSoRaGyyDal2M8DR-6vzPsV5x5sKn7TupqAGaoI0drNq2yVQUG1ktpiyoip7dsUGa58fPZ7dNlM0ZKVDox3Rg/s400/default.gif); width:35px;height:35px; }
.avatar-image-container img { border:none;}

Oke, simpan template dan selesai.
Untuk menampilkannya, sebelum submit comment, klik Preview terus ada pilihan upload di sana. Nah, selamat mencoba ^_^