Cara Merubah Gambar Anonim Komentar Blogger dengan CSS

Kalian mungkin sering melihat gambar Anonim/Anonymous dari komentar blogspot yang menampilkan gambar orang yang berwarna abu-abu. Nah gambar itu dapat dimanipulasi dengan berbagi cara. Diantaranya dengan Javascript atau dengan jQuery. Tapi yang kali ini yang saya bagikan yaitu hanya dengan CSS.
Yah Manipulasi itu ternyata dapat dilakukan hanya dengan CSS khususnya CSS3 atribut selector. Intinya dengan menggunakan CSS3 attribute selector kita akan menentukan attribute src yang mengandung link dari gambar anonim kemudian menggantinya dengan gambar yang kita hendaki.
Link dari gambar anonim dari blogger pada umumnya seperti ini http://img1.blogblog.com/img/anon36.png. Nah itulah nantinya yang akan kita rubah.

Berikut ini adalah CSS yang digunakan :

 

.comments .avatar-image-container img[src="http://img1.blogblog.com/img/anon36.png"] {
content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinFj8wBAYiktq65xqZ0xu-G-lvxfGo7Lg61KJNCS4J336jqwCA1OB7FG72aY3nVWloxSDeAI4XX_hyphenhyphenSeAyGVQyikgQKaMKqKB44HzOg9Z-twE_js4su84SfS7iMUzeRb9tXmgXqarG_kRB/s70/user-anonymous-icon.png);
}

Yah hanya satu CSS yang digunakan.
Jika ingin mengganti gambarnya silahkan ganti link gambar yang berwarna putih sesuai yang anda inginkan.
Karena menggunakan css attribute selector yang specifik maka cara diatas juga bisa digunakan selain gambar anonim.

NB :Cara ini hanya berhasil diterapkan pada browser (webkit) seperti google chrome dan maxthon
Salam Blogger.

About the Author

Written by Admin

Previl_TM is a modern, template is very suitable for a template of your blog,and features a very cool and nice so from me, Predator Evil TM