Tạo Widget Bình Luận Mới Nhất Với Avatar Bo Tròn Đẹp Cho Blogspot

Chào các bạn, thì khá lâu mình chưa ra thủ thuật nào về Blogspot. Vậy hôm nay, mình sẽ ra bài viết về Cách tạo Bình Luận Mới Nhất với Avatar bo tròn đẹp cho blogspot.

Đây là một widget đẹp , gọn nhẹ giúp hiện ra những bình luận mới nhất, giúp bạn dễ dàng quản lí các người lạ đã bình luận bài viết của bạn để tiện theo dõi và trả lời comment đó. Demo thì các bạn có thể demo chân trang của blog mình.

CÁC BƯỚC THỰC HIỆN 

Bước 1: Vào phần Bố cục, tạo một widget HTML/Javascript

Bước 2: Dán toàn bộ code này vào: 

<style>.comment-info2_BSW {clear: both; width: 100%; float: left; margin: 0 0 15px; }.comment-info2_BSW .left {background: #dedede; padding: 3px 15px; border-radius: 100px; display: block; text-transform: uppercase; font: 400 12px Roboto;}.comment-info2_BSW .right a {font: 500 12px Roboto,sans-serif; text-transform: uppercase; background: #dedede; padding: 3px 15px; box-sizing: border-box; display: block; border-radius: 100px;}.comment-info2_BSW .right a:hover {opacity: .8}ul.idbcomments{list-style:none;margin:0;padding:0}.idbcomments li{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:0!important;word-break:break-all;padding:0 0 7px!important}.idbcomments li .avatarImage{float:left;margin-right:12px;position:relative;overflow:hidden}.idbcomments li img{border-radius:100%;position:relative;overflow:hidden;display:block;width:45px;height:45px}.idbcomments li a{font-weight:700}.idbcomments li span{color: #666; display: block; background: #dedede; padding: 10px; border-radius: 100px}</style><script type="text/javascript">//<![CDATA[// Recent Commentsfunction idbcomments(a) {    var e;    e = '<ul class="idbcomments">';    for (var t = 0; numComments > t; t++) {        var r, o, n, i;        if (t == a.feed.entry.length) break;        e += "<li>";        for (var d = a.feed.entry[t], s = 0; s < d.link.length; s++) "alternate" == d.link[s].rel && (r = d.link[s].href);        for (var l = 0; l < d.author.length; l++) o = d.author[l].name.$t, n = d.author[l].gd$image.src;        n = -1 != n.indexOf("/s1600/") ? n.replace("/s1600/", "/s" + avatarSize + "-c/") : -1 != n.indexOf("/s220/") ? n.replace("/s220/", "/s" + avatarSize + "-c/") : -1 != n.indexOf("/s512-c/") && 0 != n.indexOf("http:") ? "http:" + n.replace("/s512-c/", "/s" + avatarSize + "-c/") : -1 != n.indexOf("blogblog.com/img/b16-rounded.gif") ? "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaoLR35Ubuj0kn1w_1y9iXnJV7YMq-OmJV75scCFzjaXsgoOerSQtp3e36B0bX0oPp5gu1tQVx2jL0s9NbNyRQE42BT5HWQ22R9seWxSgz5pxVBG5d0rytPjho9Zit1FN2S85yO_BPY-f1/" + avatarSize + "/blogger.png" : -1 != n.indexOf("blogblog.com/img/openid16-rounded.gif") ? "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjH2jIcLODhz8smuwQa6mnuHMJgDmVRZnLtSvmiuZlaQc1fWyYNLl1LtgczbDbwZXZok57G2H9Y50YBPDUqqlDQcv4o7eTJzbJHBsqX78BPTGUVDaWir_grIJpYWCLK6sYSpr000bA6rzgg/" + avatarSize + "/openid.png" : -1 != n.indexOf("blogblog.com/img/blank.gif") ? -1 != defaultAvatar.indexOf("gravatar.com") ? defaultAvatar + "&s=" + avatarSize : defaultAvatar : n, 1 == showAvatar && (i = 1 == roundAvatar ? "avatarRound" : "", e += '<div class="avatarImage ' + i + '"><a title="Truy cập đến bình luận đó" href="' + r + '"><img class="' + i + '" src="' + n + '" alt="' + o + '" width="' + avatarSize + '" height="' + avatarSize + '"/></a></div>'), e += '<a style="display:none" href="' + r + '">' + o + "</a>";        var A = d.content.$t,            v = A.replace(/(<([^>]+)>)/gi, "");        "" != v && v.length > characters ? (v = v.substring(0, characters), v += "&hellip;", 1 == showMorelink && (v += '<a href="' + r + '">' + moreLinktext + "</a>")) : v = v, e += "<span>" + v + "</span>", e += "</li>"    }    e += "</ul>";    var c = "";    0 == hideCredits && (c = "display:block;"), e += "", document.write(e)}var numComments = 6,    showAvatar = !0,    avatarSize = 42,    roundAvatar = !0,    characters = 30,    showMorelink = !1,    defaultAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji3beuNj2u9IWErzGhcwF4H0QHTt3ywSHiKX-oubPs6NTQl9ea49mP4-w-WWxtkAEEkJZ-cdxZ03bnp-ihQNOM8Q1ZMWRF1_HLxHGhVk1ZTHKaZGWjQ0NHoavbQVOsNGY8kXKQuDTb1lvJ/s35/Logo-Bac-Si-Windows.png",    hideCredits = !0,    numComments = numComments || 5,    avatarSize = avatarSize || 60,    characters = characters || 25,    defaultAvatar = defaultAvatar || "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji3beuNj2u9IWErzGhcwF4H0QHTt3ywSHiKX-oubPs6NTQl9ea49mP4-w-WWxtkAEEkJZ-cdxZ03bnp-ihQNOM8Q1ZMWRF1_HLxHGhVk1ZTHKaZGWjQ0NHoavbQVOsNGY8kXKQuDTb1lvJ/s35/Logo-Bac-Si-Windows.png",    moreLinktext = moreLinktext || " More &raquo;",    showAvatar = "undefined" == typeof showAvatar ? !0 : showAvatar,    showMorelink = "undefined" == typeof showMorelink ? !1 : showMorelink,    roundAvatar = "undefined" == typeof roundAvatar ? !0 : roundAvatar,    hideCredits = "undefined" == typeof hideCredits ? !1 : roundAvatar;//]]></script><script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=idbcomments"></script>

<script type="text/javascript">//<![CDATA[function totalPosts(json){document.getElementById('Stats1_totalPosts').innerHTML=json.feed.openSearch$totalResults.$t};function totalComments(json){document.getElementById('Stats1_totalComments').innerHTML=json.feed.openSearch$totalResults.$t};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalPosts\"><\/script><script type=\"text/javascript\" src=\"/feeds/comments/default?alt=json-in-script&max-results=0&callback=totalComments\"><\/script>');//]]></script>

Bước 3: Lưu tiện ích. Nhớ chỉnh lại một số thông số nhé !
   
                                                                                        Source code: Bacsiwindow.com

                                                                                                           Editer: Nguyenbau.com