Tạo Style Comment Đẹp 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é :D


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:1px solid #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 -5px 4px;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 0 10px;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é

31 Comments

  1. Replies
    1. Em thấy kì ko, như ko cái khung hiện cmt ngắn ngủn có 1 đụt chi vậy, sao ko để full width cho dễ nhìn.

      Delete
    2. Tùy sở thích chớ anh :v

      Delete
  2. Năm mới , Nam chúc blog mạnh khỏe , làm ăn thịnh vượng , sớm đưa ra thủ thuật hay cho mọi người

    ReplyDelete
  3. Chúc mừng năm mới nha, năm mới viết bài mới đi nào :))

    ReplyDelete
  4. nắm mới chúc long đẹp trai hơn và nhiều sức khoẻ vạn sự như ý <3

    ReplyDelete
    Replies
    1. cảm ơn nhé chúc bạn thành công hơn nữa :D

      Delete
  5. Chúc ông năm mới vui vẻ nha

    ReplyDelete
  6. đặt lại lk tôi phát gỡ lúc nào kb
    RiusBlogger
    https://riusdesigner.blogspot.com/

    ReplyDelete
BÀI ĐĂNG TRƯỚC BÀI TIẾP THEO