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.
you want to get a dollar ?? Click Here
0 comments:
Post a Comment