Tuesday, June 26, 2012

mempercantik Kotak Komentar Blogspot

Posted by Unknown Tuesday, June 26, 2012, under | 7 comments

Cara Merubah Tampilan Kotak Komentar Blog - Merasa bosen dengan tampilan kotak komentar blog yang biasa dan kaku, sobat bisa mengantinya dengan tampilan kotak komentar yang bagus dan elegan. Berikut saya jelaskan bagaimana Cara Merubah Tampilan Kotak Komentar Blog yang bagus dan elegan. Tapi sebenarnya cara ini sudah banyak blog-blog lain yang udah menulis artikel tentang ini dan saya pun dapat kodenya copas dari blog tetangga. Tapi menurut saya gpp lah untuk melengkapi refrensi tutorial blog yang saya bagun. 
Berikut ini akan saya jelaskan bagaimana cara memasangnya :
1. Login ke Akun Blogger sobat.
2. Pilih Menu Template.
3. Klik Edit HTML.
4. Centang Expand Template Widget.
5. Cari kode seperti ini  ]]></b:skin> (gunakkan Ctrl+F untuk pencarian yang lebih cepat).
6. Copas kode dibawah ini.

.comments{display:block;background:#F2F2F2;padding:5px;} .comments .comment-block{position:relative;background:#FAFAFA;margin-left:45;padding:4px;text-align:left; border-bottom:1px solid #C5C5C5;box-shadow:1px 4px 1px #C7C7C7;-moz-box-shadow:1px 4px 1px #C7C7C7;-webkit-box-shadow:1px 4px 1px #C7C7C7;} .comments .comment-content{margin-top:0px;margin-right:0px;margin-bottom:0px;padding: 5px 10px 5px 5px;background:#eee;color:#333;text-decoration:none;font:normal normal 12px arial;font-style:italic;} .comments .avatar-image-container{ padding:1px; background:#FFFFFF; box-shadow:1px 2px 1px #555;-moz-box-shadow:1px 2px 1px #555;-webkit-box-shadow:1px 2px 1px #555; z-index:9999;} .comments .avatar-image-container :hover{padding:1px;background:#FFFFFF;box-shadow:1px 2px 1px #555;-moz-box-shadow:1px 2px 1px #555;-webkit-box-shadow:1px 2px 1px #555;opacity:0.6;z-index:9999;} .comments .comment-replies {display:block;position:relative;background:#E5E5E5;border-right:3px solid #fff;border-bottom:3px solid #fff;border-top:3px solid #ccc;border-left:3px solid #ccc;margin-left:55px; -moz-border-radius: 10px;-ms-border-radius: 10px;-o-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px;} .comments .comment-header {display:block;padding: 5px;background:#D8D8D8;border-bottom:1px solid #aaa;text-decoration:none;font:normal normal 12px Georgia,Serif} .comments .comments-content .icon.blog-author { background: url('https://lh3.googleusercontent.com/-8rCN71wXRuk/T1rm8TTPrTI/AAAAAAAABX0/54h4ZG_pDGE/h20/penulis.jpg') no-repeat;border: 1px solid #ddd;} .comments .comment-actions {display:block;padding: 5px;color:blue;background:#E5E5E5;border-top:1px solid #aaa;} .comments .comment-actions a{color:blue;text-decoration:none;font:normal normal 12px Georgia,Serif} .comments .comment-actions a:hover{color:#000;text-decoration:none;} .comments .comment-actions .item-control{display:none;}

7. Taruh kode tepat diatas ]]></b:skin>
8. Save atau Simpan Template
Nah, kurang lebihnya seperti itu. Jika kode ini tidak berfungsi sebaiknya sobat baca artikel ini Cara Memperbaiki Komentar. Sampai disini dulu sobat artikel yang saya tulis.... Semoga bermanfaat!!! kritik dan saran sobat bisa sampaikan di kotak komentar.

7 comments

July 11, 2012 at 8:19 AM

yes,...jadi elegan kotak komentar ane di HUKUM KEHUTANAN

October 5, 2012 at 7:22 AM

knapa yah ko pas mw di klik kanan ko gk bsa !!!!!!!!!!!!!

November 24, 2012 at 8:53 PM

klik aja klik kanan nya terus!
sampai keluar pesan.di pesan itu ada kotak nya! centang deh tu kotak!

December 4, 2012 at 5:59 AM

gan di blog ane gk ngaruh dia,cemna tu gan?ada solusi??

April 15, 2013 at 7:35 AM

wah keren tuh.. saya coba gan

Anonymous
September 19, 2014 at 11:37 PM

kami suka gaya kalian :)

June 21, 2015 at 9:06 PM

makasih yaa gan

Post a Comment

BerKomentar Lah Dengan Baik Dengan Berkata Bermanusiawi Jangan Berkata Kasar Di Posting Ini Atau Akun Anda Akan Kami Hacking Jadi Berhati Hatilah Sebelom Berkomentar -":Salam HaCker ":-

Related Posts Plugin for WordPress, Blogger...

Tags

Blog Archive

Blog Archive

 
cursor: url("https://picasaweb.google.com/110667291707517219649/IMAGETUTORIAL2#5729338440284600194"), default;