Bảo trợ bởi

Tạo Style Comment Giống LEBALONGBLOG Cho Blogspot

Hello xin chào mọi người trong thời gian vừa qua mình ít đăng bài vì công việc bận khá nhiều sẵn tiện hôm nay mình mới edit lại 1 style comment theo sở thích của mình và xin phép chia sẽ cho mọi người cùng dùng nếu thích nhé !


Hướng dẫn sử dụng

Đăng nhập vào trang quản trị Blogger và thêm tất cả CSS này trước ]]></b:skin> nhé:

.comments h4{display:inline-block;position:relative;font-size:20px;color:#333;text-transform:none;font-weight:400;z-index:1;margin:0;}
.comments .comments-content{margin:0;padding:0}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.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;display:none}
.comments .avatar-image-container{float:left;overflow:hidden;position:absolute;padding:3px;background:#fff;border:1px solid #e1e1e1}
.comments .avatar-image-container,.comments .avatar-image-container img{height:35px;max-height:35px;width:35px;max-width:35px;border-radius: 50px;}
.comments .comment-block {
overflow: hidden;
padding: 10px;
background: #ededed;
display: inline-block; border-radius: 10px;
}
.comments .comments-content .icon.blog-author:before {
font-weight: 900;
font-family: fontawesome;
content: "\f00c";
background: #ededed;
display: inline-block;
color: #0053f9;
position: relative;
top: 3px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
line-height: 13px;
overflow: hidden;
text-align: center;
padding: 2px 4px 1px;
}
.comments .comment-block{margin-left:60px;}
.comments .comments-content .comment-replies{border-left:1px solid #e1e1e1;padding:0 0 0 23px}
.comment-replies{margin: 0;}
.comments .comments-content .inline-thread{padding:0}
.comments .comment-actions{float:right;position:relative}
.comments .comments-content .comment-header{color:#3D8FE8;font-size:16px;font-weight:400;display:block;overflow:hidden;clear:both;margin:0 0 10px;padding:0 0 5px;border-bottom:1pxsolid #D4D8DB}
.comments .comments-content .user{font-style:normal;font-weight:700;display:inline-block;font-size:15px}
.comments .blog-author a:after{display:inline-block;vertical-align:middle;content:"\f00c";font-family:"Font Awesome 5 Free";font-weight:700;padding:5px;margin:-7px 0 -5px4px;background:#ccc;color:#666;border-radius:50%;font-size:12px}
.comments .comments-content .comment-content{text-align:left;font-size:16px;line-height:normal;color:#111;margin:5px 0}
.comments .comment .comment-actions a{margin:0;color:#aaa;font-weight:400;font-size:12.5px;padding:0}
.comments .comment .comment-actions a:hover{color:#3b5998;text-decoration:none}
.comments .comments-content .datetime{color:#999;float:right;font-size:12px;position:relative;margin:0 0 010px;display:inline-block}
.comments .comments-content .comment-header a:hover{color:#3b5998}
.comments .thread-toggle{padding:0;margin:5px 0;display:none}
.comments .thread-toggle .thread-arrow{height:7px;margin:0 3px 2px 0}
.comments .thread-expanded{padding:0}
.comments .comments-content .comment-thread{margin:0}
.comment-thread ol{padding: 0;}
.comment-replies { margin: 15px 0 0; margin-left: 60px;}
.comments .continue a{padding:0 0 0 60px;font-weight:400;display:none}
.comments .comments-content .loadmore.loaded{margin:0;padding:0;display:none}
.comments .comment-replybox-thread{margin:0}


Lưu ý: Nhớ xóa toàn bộ CSS cũ nếu không sẽ bị lỗi nhé !

Bài viết mang tính chất cá nhân. Chúng tôi không chịu trách nhiệm về lỗi code. Mọi thắc mắc liên hệ tại liên kết gốc và bình luận tại bài viết chủ tác giả !
Được xuất bản bởi Lê Bá Long IT

Bình luận

XEM NHIỀU TRONG TUẦN

Bạn có thể quan tâm