Kênh Tên Miền chuyên cung cấp tên miền đẹp, giá rẻ! Hãy liên hệ kỹ thuật: 0914205579 - Kinh doanh: 0912191357 để được tư vấn, hướng dẫn miễn phí, Cảm ơn quý khách đã ủng hộ trong thời gian qua!
kiem tien, kiem tien online, kiem tien truc tuyen, kiem tien tren mang
Sunday, May 18, 2014

Sau hai giao diện nhận xét đã chia sẻ ở bài trước, hôm nay lại chia sẻ thêm một lần nữa một giao diện rất đẹp của trackmyblog. Có đánh số thứ tự nhận xét, có phân cấp cho trả lời, giao diện màu trắng đơn giản bạn có thể xem thử ở hình dưới. Nhìn thực tế sẽ đẹp hơn nhiều.



Thêm một giao diện nhận xét khác cho Blogger


Thêm giao diện nhận xét vào Blogger

1. Đăng nhập vào Blogger >> Mẫu >> Chỉnh sửa HTML





Thêm một giao diện nhận xét khác cho Blogger


2. Tìm đến thẻ ]]><b:skin> và thêm đoạn CSS sau vào bên trên



Thêm một giao diện nhận xét khác cho Blogger


/*==================
Comments CSS
=========================*/
#comments{background:white;padding:20px;border:1px solid #dcdcdc;}
#comments h4{font-size:28px;color:#414141;line-height:2em;}
.comments ol li:before {
content: counters(trackit, ".");
font-size: 3.5rem;
color: rgba(0, 0, 0, 0.16);
right: 0.3em;
position: absolute;
padding: .2em 0 0 0;
text-shadow:1px 1px 1px white}
.comments ol li {counter-increment: trackit;}
.comments ol {counter-reset: trackit;}
.comments .comments-content .comment-content {text-align: justify;border:1px solid #e1e1e1;padding:20px;margin-left:-40px;margin-top:35px}
.comments .comments-content .comment-header{width:58%;position:relative;padding:0 25px;margin:10px 0 0;}
.comments .comments-content .user {font-style: normal;font-weight: normal;color:#414141;font-size:20px;}
.comments .comments-content .user a{color:#414141;font-family:impact, arial, sans serif}
.comments .comments-content .user.blog-author a{color:#4085FD}
span.datetime.secondary-text a{color:#b9b9b9;font-style:italic}
.comments .comments-content .datetime {margin:0 0 0 0;color:#616161;fontsize:12px;display:block}
.comments .comments-content .comment-thread ol {list-style-type: none;padding: 0;margin: 0 0 0 ;text-align: left;}
span.item-control.blog-admin{display:none}
.comments .thread-toggle {display:none;}
#comments .comment-actions.secondary-text{text-decoration:none;}
.comments .comment .comment-actions a {
padding-right: 5px;
padding-top: 5px;
text-decoration:none;
text-align:right}
.comments .comment .comment-actions a:hover{text-decoration:none}
.comments .continue a {
display: none!important}
.comments .avatar-image-container img {max-width: 60px;max-height:60px;width:60px;height:60px;z-index:1;float:left;}
.comments .avatar-image-container {float: left;max-height: 60px;height:60px;overflow: hidden;width: 60px;max-width:60px;border-radius: 0 50% 50% 50%;-moz-border-radius:0 50% 50% 50%;-o-border-radius:0 50% 50% 50%;border:1px solid #dcdcdc;background:#fff;}
.comment .comment-replies .comment{border-top:5px solid #414141;border-left:3px solid #f5f5f5;border-right:3px solid #f5f5f5;padding:10px;background:#f5f5f5}
.comments .comments-content .comment-replies .comment,  .comments .comments-content .comment-replies .comment:first-child, .comments .comments-content .comment-replies .comment:last-child {margin: 0;padding: 1em;}
.comments .comments-content .comment:last-child, .comments .comments-content .comment:first-child {padding-top: 5px;padding-bottom:5px;list-style:none;position: relative;}
.comment-thread.inline-thread .comment-content {background:#fff}
3. Lưu lại và tận hưởng. Chúc bạn thành công

0 comments:

Post a Comment

Popular Posts