Cara Membuat Avatar Comments Bulat,mungkin sudah banyak blogger yang share tutorial ini.tapi tidak ada salahnya jika saya juga ikut berbagi dengan sobat blogger semua,kebetulan saya juga baru membuat comments avatar menjadi bulat pada blog ini.
Comments Avatar atau photo komentar yang ada pada blog kita pada umumnya adalah berbentuk persegi atau kotak.
Untuk mempercantik tampilan pada blog kita salah satunya dengan membuat comments avatar menjadi bulat.
Sebelum
Sesudah
Bagi sobat yang ingin membuat comments avatar menjadi bulat seperti pada blog saya,silahkan ikuti langkah-langkah
Cara Membuat Avatar Comments Bulat dibawah ini :
1. Login blog Kamu
2. Klik Design > Edit HTML > centang pada Expand widget template
3. Cari kode ]]></b:skin>
Gunakan CTRL+F agar lebih mudah dalam mencari kodenya
4. Copy kode dibawah ini dan letakan diatas kode ]]></b:skin>
.comments .avatar-image-container{
max-height:50px;
max-width:50px;
height:50px;
width:50px;
border-radius:29px;
padding:2px;
border:2px solid #39E939;
box-shadow:-1px -1px 1px #444,2px 2px 4px #444;
background:#1B3CFA;
margin:2px 4px 2px 2px;
}
.comments .avatar-image-container img{
width:50px;
max-width:50px;
height:50px;
max-height:50px;
border-radius:25px;
border:0 solid #FE081C !important;
}
.comments .comment-block{
margin-left:75px;
}
max-height:50px;
max-width:50px;
height:50px;
width:50px;
border-radius:29px;
padding:2px;
border:2px solid #39E939;
box-shadow:-1px -1px 1px #444,2px 2px 4px #444;
background:#1B3CFA;
margin:2px 4px 2px 2px;
}
.comments .avatar-image-container img{
width:50px;
max-width:50px;
height:50px;
max-height:50px;
border-radius:25px;
border:0 solid #FE081C !important;
}
.comments .comment-block{
margin-left:75px;
}
5. Klik Pratinjau,jika tiada kesalahan silahkan Klik Simpan dan lihat hasilnya pada kolom komentar
Keterangan : Untuk warna background dan warna border sesuaikan dengan keinginan sobat.
Semoga tutorial Cara Membuat Avatar Comments Bulat ini bermanfaat
Salam Blogger
Sumber : Shaka InghetS
68 komentar
Click here for komentarSelamat pagi sobat, ilmu memang tidak akan ada habisnya walaupun di bagikan dan selalu ada yang baru....garis pinggir pada widget tersebut sangat terkesan dan enak dipandang sob....Trima kasih
Balas Hapusbagus kang tutornya,wajib ane bookmark neh.
Balas HapusKalau dulu mobil yang persegi itu Hijet 55 Wide,membosankan dan jadul.Seperti halnya avatar persegi,terlihat sangat membosankan dan "jadul" pula.
Balas HapusDengan avatar komentar bulat,membaca komentar jadi tambah semangat,hehe.
Nice share kawan,maksih sudah berbagi,ijin raktek.
Happy blogging.
dengan tampilan bulat itu serasa lebih unik dan memikat mata yang memandangnya :)
Balas HapusRada-rada tampil beda komenya kalau ada bulatanya ya gan.
Balas HapusOm Sob udah di terapin...
Balas HapusJadi lucu...heheh
makasih
ou ini toh caranya, ehm, jadi unik ya. saya pernah liatnya nie. mantap kali.. tapi juga tergantung template, kaya punya saya ga bisa di praktekan ini
Balas HapusBtw, sory ya. mungkin akan sedikit mengurangi aktifitas blogwalking, dunia nyata mulai menantikan kehadiran saya. so, harap maklumnya ya
punya ku gagal om :(
Balas Hapusboleh juga kang
Balas HapusKalau avatar bulat, diblogku cuma ada di widget Recent Comment.
Balas HapusKalau avatar bulat itu dipasang diblogku, pantes gk ya?
iya sih, memang manis bentuknya. tapi kalo saya, sementara masih bertahan dengan gaya ortodoks. halahh, hihi
Balas Hapusbentuknya keren sih, di save dulu deh kapan kapan di praktekin... alnya template sedang error 300an he...
Balas Hapussilhkan sob....:)
Balas Hapusmksh kunjunganya
gapapa mas gya lama juga boleh pake :)
Balas Hapuscoba aja sob,gratis kok :)
Balas Hapushehe ya sob :)
Balas Hapusmksh kunjunganya
cek betul2 saat memasukan kodenya
Balas Hapusoke sob....mksh kunjunganya
Balas Hapusmksh kembali atas kunjunganya
Balas Hapusya sob...biar nampk unik sikit :)
Balas Hapushehe bisa aja agan nih :)
Balas Hapusmksh kunjunganya gan
silahkan sob....
Balas Hapushappy blogging to :)
monggoh kang :)
Balas Hapusterimakasih juga sob atas kunjunganya
Balas Hapussobat kotak like Fb sobat exitnya kenapa linknya ke blogger? kan jadi ga bisa ditutup jadi sy mau lihat link sahabat juga ga bisa..hehehe
Balas Hapushehe...itu karena pengaruh loading belum full
Balas Hapuscoba biarkan sampai full trus klik exit pasti lancar dan tidak masuk ke blogger
makin mantap aja nih blog.. hehehe.. ane simpan dulu, ntar kalau butuh tinggal caplok aja.. hehehe.. :D
Balas Hapushehe....:) mksh kunjunganya gan
Balas HapusPostingan yg luar biasa ini sob, kebetulan inilah yg sedang saya cari, saya akan coba semoga berhasil ya sob...
Balas HapusTerima kasih atas ilmunya ini sob.
saya coba nih apa cocok apa gak belum juga tahu hasilnya..hehe...
terima kasih
silahkan sob....
Balas Hapusmksh kunjunganya
sudah dicoba tapi tetap saja tidak berhasil, apa ada tambahan lainnya untuk kode html lainnya di java scrip sob, atau mungkin saya yg salah yah..hehe..
Balas Hapustampilkan dulu poto untuk kometarnya boss
Balas Hapuskalau di blogger,klik pengaturan/setelan trus pilih komentar trus pada Tampilkan gambar profil dalam komentar? pilih (ya)
tapi kalau wordpress aq kurang paham
Oke mas Reo.. ta bungkus dulu ya toturnya... :)
Balas HapusTrima kasih sdh berbagi :)
ok sob...mksh kembali
Balas Hapussukses slalu buat anda :)
wah mantap kang geng enjing kang smakin maju za blog pean,bnyak skali ide2 brmanfaat,skrg dah jd bloger nti g lama lg jd programer ulung,semga z kang aku do'akn smga sukses ssuai harapan.
Balas Hapussudah dicoba Blog satunya juga payah nian ini sob, di blog wawasan juga kucoba, ternyata gagal juga nih, mungkin lain kali perlu di coba lagi nih sob, oke deh terima kasih semua infonya...
Balas Hapusterima kasih
sama2 sob
Balas Hapusblogger asal-asalan ae kang :)
Balas Hapusaamiin ya robb....mksh doanya kang
wuihh kereenn banget om
Balas Hapusapanya yg keren sob ?
Balas Hapus. . widichhhhh,, aq nya nongol. he..86x. upzZz,, ijin nyoba achhh . .
Balas Hapusmonggoh mba Vpie :)
Balas Hapusmakin keren dan mantab nih artikelnya, sukses dan maju jaya terus kang.
Balas Hapussalam sehat selalu ye.
btw kotak komentarnya jadi keren euy...
mauuu!!
oke sob
Balas HapusMampir aja sambil nyimak sob,
Balas Hapusmkh udah mampir sob
Balas Hapusslm blogger
wew,,,
Balas Hapuspatut di coba ini,,
Saya sudahh menerapkann script ini dalam blog saya malam ini mas Reo Adam. Alhamdulillah, hasilnya indah sekali.
Balas HapusTerima kasih mas Reo Adam.
Matur Suwun mas
sama2 mas asep
Balas Hapusterimakasih juga
tak coba yo mas,nek ora iso sampeyan tanggung jawab loh
Balas Hapuscihuy,akhirnya punya blok cantik. pakai script di atas makin keyen mas.:P
Balas Hapuskeyen banget.... B-)
Balas Hapusnek gawe segitiga sih piwe lik..?
Balas Hapusthuthuk pojoke mbi martil lih nyiku :D
Balas HapusWah mantap bang...
Balas Hapusinformasi ini saya dapat dati KY
tapi di blog satunya gagal, mungkin karena gak keluar gambarnya
terima kasih, ilmunya sangat bermanfaat
Sangat menarik mas...., tapi saya belum sempat utak-atik, saya bookmark dulu halaman ini...
Balas HapusMakasih banget infonya
saya barusan mencoba ternyata berhasil,jadi sekarang mau mengucapkan Terimakasih kepada mas Reo,dan mohon ma'af karena minta ijinya belakangan Kang,,,,
Balas HapusTiba-tiba menghilang avatar bulatnya ,jadi saya balik lagi kesini,saya pasang ulang lagi dan berhasil.....Terimakasih Kang Reo Adam,,,,
Balas Hapushihihihi....maaf kang,saya baru tau ada komentar masuk disini :)
Balas Hapusmonggoh,silahkan pak :)
Balas Hapussemoga bisa membantu dan bermanfaat untuk semua.
terimakasih juga kunjunganya boss :)
Balas Hapusthanks infonya gan
Balas Hapusthanks kunjungannya sob
Balas Hapusane coba dulu sob..
Balas Hapusthanks.. :d
Manteb gan jadi keren tampilan komentarnya
Balas Hapuskeren nih tutorialnya , terima kasih gan http://memolodys.blogspot.com/
Balas Hapusdiblog ane gak work sob
Balas HapusIjin nyoba ah... :)
Balas HapusPERINGATAN....!!!
Gak Usah Di Komen Bro....
ADMIN lagi maen game
Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon