[Blogger] Hộp nhận xét mới có avatar đơn giản cho blogspot

Chỉ với 2 bước, bạn sẽ có ngay tiện ích nhận xét mới kèm avatar khá đơn giản  và nhẹ cho trang blogspot của mình. Một tiện ích không thể thiếu cho các blog cá nhân, giúp ta dễ dàng theo dõi các lượt bình luận của khách truy cập mà không cần phải vào trang quản trị Blooger.


Live Demo

Cách thêm tiện ích nhận xét mới cho blog

1. Tạo tiện ích mới

- Đăng nhập trang quản trị của blog, vào "Bố cục" / "Thêm tiện ích" chọn "HTML/JAVASCRIPTS" tại vị trí mong muốn.

- Chèn đoạn code dưới đây vào tiện ích vừa tạo:

<style type='text/css'>
    ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
    .w2b_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{float: left;margin: 0 6px 0 0;position: relative;overflow: hidden}
    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
  .w2b_recent_comments li span{margin-top: 4px;display: block;font-size: 13px;font-style:italic;line-height: 1.4;background: rgba(36, 36, 36, 0.07);border: 1px solid rgba(87, 77, 77, 0.2);padding: 10px 3px 3px 3px}
    .w2b_recent_comments li a{margin: -3px 0px 0px;padding: 1px}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
    numComments     = 5,
    showAvatar     = true,
    avatarSize     = 30,
    roundAvatar    = false,
    characters     = 50,
    showMorelink    = false,
    moreLinktext    = "Xem thêm »",
    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",
    hideCredits    = false;
//]]>
</script>
<script type="text/javascript" src="https://googledrive.com/host/0Byy5EJuVVBbdZHZidUtrZXBTa2M"></script>
<script type="text/javascript"
src='http://www.tintucict.tk/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=5'></script>

2. Thiết lập cho hộp nhận xét mới

• numComments     = 5, Số nhận xét hiển thị
• showAvatar     = true, Hiển thị avatar
• avatarSize     = 30, Kích cỡ avatar
•  roundAvatar    = false, Avatar vuông (True = tròn)
• characters     = 50, số ký tự được hiển thị

Quan trọng: Thay thế lại đường dẫn thành địa chỉ blog của bạn.

<script type="text/javascript" src='http://www.tintucict.tk/feeds/comments/default?alt=json&amp;callback=w2b_recent_comments&amp;max-results=5'></script>