author-photo

Cara Membuat Avatar Comments Bulat



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
Cara Membuat Avatar Comments Bulat

Sesudah
Cara Membuat Avatar Comments Bulat

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;
}


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

Share this:

70 komentar

Click here for komentar
September 13, 2012 at 1:07 AM

Selamat 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 Hapus
avatar
admin
September 13, 2012 at 1:56 AM

bagus kang tutornya,wajib ane bookmark neh.

Balas Hapus
avatar
admin
September 13, 2012 at 2:49 AM

Kalau dulu mobil yang persegi itu Hijet 55 Wide,membosankan dan jadul.Seperti halnya avatar persegi,terlihat sangat membosankan dan "jadul" pula.
Dengan avatar komentar bulat,membaca komentar jadi tambah semangat,hehe.
Nice share kawan,maksih sudah berbagi,ijin raktek.
Happy blogging.

Balas Hapus
avatar
admin
September 13, 2012 at 5:24 AM

dengan tampilan bulat itu serasa lebih unik dan memikat mata yang memandangnya :)

Balas Hapus
avatar
admin
September 13, 2012 at 6:19 AM

Rada-rada tampil beda komenya kalau ada bulatanya ya gan.

Balas Hapus
avatar
admin
September 13, 2012 at 8:00 AM

Om Sob udah di terapin...

Jadi lucu...heheh

makasih

Balas Hapus
avatar
admin
September 13, 2012 at 8:23 AM

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

Btw, sory ya. mungkin akan sedikit mengurangi aktifitas blogwalking, dunia nyata mulai menantikan kehadiran saya. so, harap maklumnya ya

Balas Hapus
avatar
admin
September 13, 2012 at 1:10 PM

Kalau avatar bulat, diblogku cuma ada di widget Recent Comment.

Kalau avatar bulat itu dipasang diblogku, pantes gk ya?

Balas Hapus
avatar
admin
September 13, 2012 at 8:48 PM

iya sih, memang manis bentuknya. tapi kalo saya, sementara masih bertahan dengan gaya ortodoks. halahh, hihi

Balas Hapus
avatar
admin
September 14, 2012 at 8:30 AM

bentuknya keren sih, di save dulu deh kapan kapan di praktekin... alnya template sedang error 300an he...

Balas Hapus
avatar
admin
September 14, 2012 at 11:28 AM

silhkan sob....:)
mksh kunjunganya

Balas Hapus
avatar
admin
September 14, 2012 at 11:29 AM

gapapa mas gya lama juga boleh pake :)

Balas Hapus
avatar
admin
September 14, 2012 at 11:31 AM

hehe ya sob :)
mksh kunjunganya

Balas Hapus
avatar
admin
September 14, 2012 at 11:32 AM

cek betul2 saat memasukan kodenya

Balas Hapus
avatar
admin
September 14, 2012 at 11:33 AM

mksh kembali atas kunjunganya

Balas Hapus
avatar
admin
September 14, 2012 at 11:34 AM

ya sob...biar nampk unik sikit :)

Balas Hapus
avatar
admin
September 14, 2012 at 11:35 AM

hehe bisa aja agan nih :)
mksh kunjunganya gan

Balas Hapus
avatar
admin
September 14, 2012 at 11:36 AM

silahkan sob....
happy blogging to :)

Balas Hapus
avatar
admin
September 14, 2012 at 11:38 AM

terimakasih juga sob atas kunjunganya

Balas Hapus
avatar
admin
KHR
September 14, 2012 at 1:46 PM

sobat 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 Hapus
avatar
admin
September 14, 2012 at 5:19 PM

hehe...itu karena pengaruh loading belum full
coba biarkan sampai full trus klik exit pasti lancar dan tidak masuk ke blogger

Balas Hapus
avatar
admin
September 14, 2012 at 7:14 PM

makin mantap aja nih blog.. hehehe.. ane simpan dulu, ntar kalau butuh tinggal caplok aja.. hehehe.. :D

Balas Hapus
avatar
admin
September 14, 2012 at 8:35 PM

hehe....:) mksh kunjunganya gan

Balas Hapus
avatar
admin
September 14, 2012 at 10:33 PM

Postingan yg luar biasa ini sob, kebetulan inilah yg sedang saya cari, saya akan coba semoga berhasil ya sob...
Terima kasih atas ilmunya ini sob.
saya coba nih apa cocok apa gak belum juga tahu hasilnya..hehe...
terima kasih

Balas Hapus
avatar
admin
September 14, 2012 at 11:11 PM

silahkan sob....
mksh kunjunganya

Balas Hapus
avatar
admin
September 14, 2012 at 11:28 PM

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 Hapus
avatar
admin
September 14, 2012 at 11:50 PM

tampilkan dulu poto untuk kometarnya boss
kalau di blogger,klik pengaturan/setelan trus pilih komentar trus pada Tampilkan gambar profil dalam komentar? pilih (ya)
tapi kalau wordpress aq kurang paham

Balas Hapus
avatar
admin
September 15, 2012 at 12:14 AM

Oke mas Reo.. ta bungkus dulu ya toturnya... :)
Trima kasih sdh berbagi :)

Balas Hapus
avatar
admin
September 15, 2012 at 1:01 AM

ok sob...mksh kembali
sukses slalu buat anda :)

Balas Hapus
avatar
admin
September 15, 2012 at 6:45 AM

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 Hapus
avatar
admin
September 15, 2012 at 9:09 AM

sudah 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...
terima kasih

Balas Hapus
avatar
admin
September 15, 2012 at 11:44 AM

blogger asal-asalan ae kang :)
aamiin ya robb....mksh doanya kang

Balas Hapus
avatar
admin
September 15, 2012 at 6:02 PM

. . widichhhhh,, aq nya nongol. he..86x. upzZz,, ijin nyoba achhh . .

Balas Hapus
avatar
admin
September 15, 2012 at 9:36 PM

makin keren dan mantab nih artikelnya, sukses dan maju jaya terus kang.
salam sehat selalu ye.
btw kotak komentarnya jadi keren euy...
mauuu!!

Balas Hapus
avatar
admin
September 16, 2012 at 10:01 AM

terimakasih gan atas info nya . .
mampir yaa http://blog.teliti.net/

Balas Hapus
avatar
admin
September 16, 2012 at 3:17 PM

Mampir aja sambil nyimak sob,

Balas Hapus
avatar
admin
September 16, 2012 at 6:43 PM

mkh udah mampir sob
slm blogger

Balas Hapus
avatar
admin
December 3, 2012 at 11:05 PM

Saya sudahh menerapkann script ini dalam blog saya malam ini mas Reo Adam. Alhamdulillah, hasilnya indah sekali.

Terima kasih mas Reo Adam.
Matur Suwun mas

Balas Hapus
avatar
admin
December 4, 2012 at 11:31 AM

sama2 mas asep
terimakasih juga

Balas Hapus
avatar
admin
December 16, 2012 at 7:42 PM

tak coba yo mas,nek ora iso sampeyan tanggung jawab loh

Balas Hapus
avatar
admin
December 16, 2012 at 7:59 PM

cihuy,akhirnya punya blok cantik. pakai script di atas makin keyen mas.:P

Balas Hapus
avatar
admin
December 29, 2012 at 9:36 PM

nek gawe segitiga sih piwe lik..?

Balas Hapus
avatar
admin
December 29, 2012 at 9:56 PM

thuthuk pojoke mbi martil lih nyiku :D

Balas Hapus
avatar
admin
February 5, 2013 at 3:26 AM

Wah mantap bang...
informasi ini saya dapat dati KY
tapi di blog satunya gagal, mungkin karena gak keluar gambarnya
terima kasih, ilmunya sangat bermanfaat

Balas Hapus
avatar
admin
February 5, 2013 at 5:26 AM

Sangat menarik mas...., tapi saya belum sempat utak-atik, saya bookmark dulu halaman ini...
Makasih banget infonya

Balas Hapus
avatar
admin
March 4, 2013 at 11:23 AM

saya barusan mencoba ternyata berhasil,jadi sekarang mau mengucapkan Terimakasih kepada mas Reo,dan mohon ma'af karena minta ijinya belakangan Kang,,,,

Balas Hapus
avatar
admin
March 9, 2013 at 8:45 PM

Tiba-tiba menghilang avatar bulatnya ,jadi saya balik lagi kesini,saya pasang ulang lagi dan berhasil.....Terimakasih Kang Reo Adam,,,,

Balas Hapus
avatar
admin
March 9, 2013 at 8:51 PM

hihihihi....maaf kang,saya baru tau ada komentar masuk disini :)

Balas Hapus
avatar
admin
March 9, 2013 at 8:52 PM

monggoh,silahkan pak :)
semoga bisa membantu dan bermanfaat untuk semua.

Balas Hapus
avatar
admin
March 9, 2013 at 8:52 PM

terimakasih juga kunjunganya boss :)

Balas Hapus
avatar
admin
July 5, 2013 at 7:25 PM

ane coba dulu sob..
thanks.. :d

Balas Hapus
avatar
admin
Anonymous
August 31, 2013 at 7:58 PM

Manteb gan jadi keren tampilan komentarnya

Balas Hapus
avatar
admin
September 29, 2013 at 10:50 AM

keren nih tutorialnya , terima kasih gan http://memolodys.blogspot.com/

Balas Hapus
avatar
admin
Anonymous
June 1, 2015 at 7:56 PM

Ijin nyoba ah... :)

Balas Hapus
avatar
admin

PERINGATAN....!!!
Gak Usah Di Komen Bro....
ADMIN lagi maen game
Show Konversi KodeHide Konversi Kode Show EmoticonHide Emoticon

Terima kasih sudah berkomentar