Menambah Background Avatar Pada Komentar Pengunjung

type='html'>

Berbicara kotak komentar memang banyak sekali hal-hal yang bisa kita utak-atik. Seperti merubah warna komentar admin berbeda dengan pengunjung, komentar dengan background dll. Nah terinspirasi dari web favorit saya kibagus. Dimana kotak komentarnya lain dari pada yang lain.

 

Pada blog tersebut bahwa setiap komentar apakah itu menggunakan profil blogger, anonymous, atau name dan url, akan muncul gambar avatar pada komentar pengunjung. Sebagai contoh lihat gambar di atas!

Untuk menambah background avatar pada komentar pengunjung ini juga sudah dijelaskan di Infonetmu. Namun tidak ada salahnya kalau kita berbagi pada orang yang belum tahu seperti saya ini. Belum lagi kasus saya mengikuti tutorial tersebut dimana salah satu kode gagal di temukan atau berbeda dengan yang dijelaskan. Baik langsung saja trik menambah background avatar pada komentar pengunjung.

1. Login ke blog kamu!

2. Klik Design

3.  Klik Edit HTML

4. Download Full template untuk backup template kamu

5. Jangan lupa : Centang   Expand Widget Templates

6. Cari kode :

]]>

7. Copy dan paste kode ini di atasnya :

#comments-block .avatar-image-container img {background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb7FEHCwxD6ZITT6XZZAOUU8lWpZbjUgaU_2HSynDOxKiNisulzvfU5YWRUVshNlHNhQY_DE6NBSSTLjQ-kSLNtbzN9VVtTtxPPTRujFYqUD0j-8lOHpaEoZbqurhzZr2VvDR7TQTHDVBI/s1600/arrow-right+copye.png) no-repeat left top; width:35px;height:35px}

8. Cari kode di bawah ini :

Jika kode di atas tidak ketemu mungkin kodenya seperti ini :

9. Hapus kode no 8 dan ganti dengan kode :

10. Cari lagi kode di bawah ini :

11. hapus dan Ganti juga kode no 10 dengan

     
     
     
     
     

     
     

     

12. Jika sudah simpan template sobat.

Lihatlah salah satu posting sobat yang ada komentar dengan anonymous atau name dan url. Saya rasa sobat sudah bisa trik menambah background avatar pada komentar pengunjung. Dengan trik ini komentar anonymous atau komentar yang menggunakan name dan url akan terlihat avatarnya.

NB.

URL no.7 bisa sobat ganti dengan url sobat. Sebagai referensi sobat bisa menggunakan icon di bawah ini. Ukuran iconnya kurang lebih 35 x 35

Cara menambah Author Box di Bawah Postingan Pada Blogspot

type='html'>seberapa pentingkah author box itu pada sebuah postingan di blog, menurut saya lumayan penting, karena dengan adanya author box pada setiap postingan, pembaca akan dengan mudah mengetahu tentang diri kita sebagai pemilik blog,di samping itu juga akan menambah cantiknya tampilan sebuah postingan di blog kita.

Ok langsung saja, berikut ini cara membuatnya:

1. Login dulu ke dasbhord blog.
2. Setelah di halaman dasbhor, pilih rancangan.
3. Selanjutnya pilih Edit HTML
4. di halaman Edit HTML, jangan lupa beri tanda centang pada Expand Template Widget
5. Kemudian cari kode berikut ]]>
6. lalu sisipkan kode berikut di bawah ini persis di atasnya;


.author-box {
background: #f0f0f0;
margin: 20px 0 40px 0;
padding: 10px;
overflow: auto;
color:#888;
font-family:verdana, sans-serif;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box a{
color:#666;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
}

7. Selanjutnya Anda cari Kode seperti ini :

setelah ketemu, cope paste dan simpan kode di bawah ini persis di bawahnya :

About Author
Sekilas info tentang diri anda

8. Sebelum anda simpan kode di atas, harap di ganti URL dengan ULR image foto anda,serta sekilas info tentang diri anda juga harus anda ubah dengan info tentang anda. About Author juga dapat anda ganti dengan judul ksesuai keingan anda.

Contoh Punya saya Jadi seperti di bawah ini saya buat:

Blogging Dan Internet
Hanya sekedar Berbagi Informasi

9. Kemudian simpan templete

Hasilnya dapat anda lihat di setiap halaman postingan blog ini.

Ok selesai sudah, semoga bermanfaat.