Tạo widget bình luận với nhất với avatar bộ tròn đẹp cho blogger

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/AVvXsEgpQhmLR6g5gBDdUsQRzXPzCbXIP-ivE176ox-24B3MSbcufWRUxa7NDuP71niwL-pxrLaP1gHAu-OvVuFrpil_32ute8Y8QY-cPxjC3eeJlwVLUjvCqXMOnBZg4JsTcaYpQq1OTD9fVp_t/" + avatarSize + "/blogger.png" : -1 != n.indexOf("blogblog.com/img/openid16-rounded.gif") ? "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvH_RSiYzctpds57Yue6OpnWzHWfsG4sX-QySF_rmtl4FKEGO6NIbRy9xgP-UU3sR99RNHXcoPBCemfJ3AgiSJZ7HxUqAVYWe1ts81KKbU2dwndDZvLZ28259ZPdkB61aPBuXAkudeoRZu/" + 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/AVvXsEjDfn193b7ZBQ9mNE5rZRzzUv06-gJWpJG8736lbnBp_cFHdYQczCg-5ts5gPSeloh38_IR4e00mBFFnmghyphenhyphenW1JePWqS-Yu6-0Va8svUVipAXJDm4SKAKvpz-g3EvvhoJ4ic9IQ_XaUTAFJ/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/AVvXsEjDfn193b7ZBQ9mNE5rZRzzUv06-gJWpJG8736lbnBp_cFHdYQczCg-5ts5gPSeloh38_IR4e00mBFFnmghyphenhyphenW1JePWqS-Yu6-0Va8svUVipAXJDm4SKAKvpz-g3EvvhoJ4ic9IQ_XaUTAFJ/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é !

Share this post

La Ngọc Hưng

Chào các bạn đến với blog truyện tổng hợp của mình nhé !

Facebook

WhatsApp

Instagram

Subscribe Our Newsletter

Posting Terkait