Kode Tampilan Komentar Blogger Responsive & Menarik

Kode Tampilan Komentar Blogger Responsive & Menarik

Sekadar menyimpan Kode Tampilan Komentar Blogger Responsive & Menarik, siapa tahu Anda juga berminat. Kode ini bekerja dengan baik di template Valid HTML dan template bawaan blogger.

Kode Tampilan Komentar Blogger Responsive & Menarik

Desainnya seperti gambar di bawah ini. Simple & Elegant!

Kode Tampilan Komentar Blogger Responsive & Menarik

Cara memasangnya, copas Kode Tampilan Komentar Blogger Responsive & Menarik ini di atas kode ]]></b:skin> atau bungkus dengan kode <style> .... </style> dan simpan di atas kode </head>

.comments{display:block;clear:both;margin:0;color:#333333}
.comments h4{font-weight:400;font-size:12px;font-style:italic;padding-top:1px}
.comments .comments-content{margin:0;padding:0}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:8px}
.comments .comments-content .comment:first-child{padding-top:0}
.facebook-tab,.fb_iframe_widget_fluid span,.fb_iframe_widget iframe{width:100%!important}
.comments .item-control{position:static}
.comments .avatar-image-container{float:left;overflow:hidden;position:absolute}
.comments .avatar-image-container,.comments .avatar-image-container img{height:45px;max-height:45px;width:45px;max-width:45px;border-radius:3px}
.comments .comment-block{overflow:hidden;padding:0 0 10px}
.comments .comment-block,.comments .comments-content .comment-replies{margin-left:60px;margin-top:0}
.comments .comments-content .inline-thread{padding:0}
.comments .comment-actions{float:left;width:100%;position:relative;margin:0}
.comments .comments-content .comment-header{font-size:12px;display:block;overflow:hidden;clear:both;margin:0 0 3px;padding:0 0 5px;border-bottom:1px solid #eee}
.comments .comments-content .comment-header a{color:#333333;transition:color .3s}
.comments .comments-content .comment-header a:hover{color:#5e52f8}
.comments .comments-content .user{font-style:normal;font-weight:600;text-transform:uppercase;display:block}
.comments .comments-content .icon.blog-author{display:none}
.comments .comments-content .comment-content{float:left;text-align:left;color:#5E5E5E;font-size:13px;line-height:1.4em;margin:5px 0 9px}
.comments .comment .comment-actions a{margin-right:5px;padding:2px 5px;background-color:#5e52f8;color:#fff;font-weight:400;font-size:10px;border-radius:2px;transition:all .3s ease}
.comments .comment .comment-actions a:hover{background-color:#272727;text-decoration:none}
.comments .comments-content .datetime{color:#aaa;float:left;font-size:11px;position:relative;display:block;text-transform:uppercase;font-style:italic;margin:4px 0 0}
.comments .comments-content .datetime a,.comments .comments-content .datetime a:hover{color:#aaa}
.comments .thread-toggle{margin-bottom:4px}
.comments .thread-toggle .thread-arrow{height:7px;margin:0 3px 2px 0}
.comments .thread-expanded{padding:8px 0 0}
.comments .comments-content .comment-thread{margin:0}
.comments .continue a{padding:0 0 0 60px;font-weight:400}
.comments .comments-content .loadmore.loaded{margin:0;padding:0}
.comments .comment-replybox-thread{margin:0}
iframe.blogger-iframe-colorize,iframe.blogger-comment-from-post{height:283px!important}
.static_page .comment-system,.static_page .comments{display:block}
.comments ol{list-style:none;margin:0;padding:0}
@media screen and (max-width:480px){.comments .comments-content .comment-replies{margin-left:0}
}

Save!

Demikian Kode Tampilan Komentar Blogger Responsive & Menarik. Happy Blogging! (www.contohblog.com).*

Related Posts

0 Komentar untuk "Kode Tampilan Komentar Blogger Responsive & Menarik"

1. Komentar spam, menyertakan Link Aktif dan Alamat Blog tidak akan muncul.
2. Tidak semua pertanyaan sempat atau bisa dijawab.
3. Bagi yang mau tanya, sebelum bertanya, silakan cari dulu di Kotak Pencarian di Sidebar.
Thanks for visiting and the comment :)

Contact Form

Name

Email *

Message *