Cách tích hợp bình luận Recent Comments v1.3 có ảnh avatar cho Blogger

Hướng dẫn thêm tiện ích nhận xét mới cho Blogger

Để thêm tiện ích nhận xét mới hay còn gọi là Recent Comments thì các bạn chỉ cần thực hiện đúng các bước sau:

1. Đăng nhập Blogger
2. Vào Bố cục
3. Thêm tiện ích HTML/Javascript
4. Dán đoạn code bên dưới vào hộp HTML/Javascript rồi Lưu lại

<style type="text/css" scoped>

ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;}

.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;padding:3px!important}

.allbloggertricks_recent li:hover{border:1px solid #ddd;}

.allbloggertricks_recent a {text-decoration:none;}

.avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px

#ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden}

.avatarRound{width:35px;height:35px}

.allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;}

</style>

<script type="text/javascript">

//<![CDATA[

    var

 numComments  = 31,

 showAvatar  = true,

 avatarSize  = 35,

 roundAvatar = false,

 characters  = 40,

 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",

 hideCredits = true;

 maxfeeds=50,

 adminBlog='Your Name';

//]]>

</script>

<script type="text/javascript">

//<![CDATA[

//eval

function hp_d11(s){var o="",ar=new Array(),os="",ic=0;for(i=0;i<s.length;i  ){c=s.charCodeAt(i);if(c<128)c=c^2;os =String.fromCharCode(c);if(os.length>80){ar[ic  ]=os;os=""}}o=ar.join("") os;return o}

//eval

var numComments = numComments || 5, avatarSize = avatarSize || 60, characters = characters || 40, defaultAvatar = defaultAvatar || "http://www.gravatar.com/avatar/?d=mm", moreLinktext = moreLinktext || " More &raquo;", showAvatar = typeof showAvatar === "undefined" ? true : showAvatar, showMorelink = typeof showMorelink === "undefined" ? false : showMorelink, roundAvatar = typeof roundAvatar === "undefined" ? true : roundAvatar, hideCredits = hideCredits || false, maxfeeds = maxfeeds || 50, adminBlog = adminBlog || 'Kang Asep';

    function allbloggertricks_recent(allbloggertricks) {

        var commentsHtml;

        commentsHtml = "<ul class=\"allbloggertricks_recent\">";

        ntotal=0;

        for (var i = 0; i < maxfeeds; i  ) {

            var commentlink, authorName, authorAvatar, avatarClass;

            if (i == allbloggertricks.feed.entry.length) {

                break;

            }

            if(ntotal>=numComments){

                break;

            }

            var entry = allbloggertricks.feed.entry[i];

            for (var l = 0; l < entry.link.length; l  ) {

                if (entry.link[l].rel == "alternate") {

                    commentlink = entry.link[l].href;

                }

            }

            for (var a = 0; a < entry.author.length; a  ) {

                authorName = entry.author[a].name.$t;

                authorAvatar = entry.author[a].gd$image.src;

            }

            if (authorName!= adminBlog && ntotal<numComments){

                ntotal  ;

                commentsHtml  = "<a href=\""   commentlink   "\"><div>";

                commentsHtml  = "<li>";

            if (authorAvatar.indexOf("/s1600/") != -1) {

                authorAvatar = authorAvatar.replace("/s1600/", "/s"   avatarSize   "-c/");

            } else if (authorAvatar.indexOf("/s220/") != -1) {

                authorAvatar = authorAvatar.replace("/s220/", "/s"   avatarSize   "-c/");

            } else if (authorAvatar.indexOf("/s512-c/") != -1 &&

                authorAvatar.indexOf("http:") != 0) {

                authorAvatar = "http:"   authorAvatar.replace("/s512-c/", "/s"   avatarSize   "-c/");

            } else if (authorAvatar.indexOf("blogblog.com/img/blank.gif") != -1) {

                if (defaultAvatar.indexOf("gravatar.com") != -1) {

                    authorAvatar = defaultAvatar   "&s="   avatarSize;

                } else {

                    authorAvatar = defaultAvatar;

                }

            } else {

                authorAvatar = authorAvatar;

            }

            if (showAvatar == true) {

                if (roundAvatar == true) {

                    avatarClass = "avatarRound";

                } else {

                    avatarClass = "";

                }

                commentsHtml  = "<div class=\"avatarImage "   avatarClass   "\"><img class=\""   avatarClass   "\" src=\""   authorAvatar   "\" alt=\""   authorName   "\" width=\""   avatarSize   "\" height=\""   avatarSize   "\"/></div>";

            }

            commentsHtml  = "<b>"   authorName   "</b>";

            var commHTML = entry.content.$t;

            var commBody = commHTML.replace(/(<([^>] )>)/gi, "");

            if (commBody != "" && commBody.length > characters) {

                commBody = commBody.substring(0, characters);

                commBody  = "&hellip;";

                if (showMorelink == true) {

                    commBody  = ""   moreLinktext   "";

                }

            } else {

                commBody = commBody;

            }

            commentsHtml  = "<span>"   commBody   "</span>";

            commentsHtml  = "</li></div></a>";

            }

        }

        commentsHtml  = "</ul>";

        var hideCSS = "";

        if (hideCredits == true) {

            hideCSS = "display:none;";

        }

        commentsHtml  = "<span style=\"font-size:8px;display:block;text-align:right;"   hideCSS   "\">dimodifikasi oleh <a href=\"http://afandi.ok-rek.com\" target=\"_blank\">Afandi Kusuma</a><br>dari: way2blogging</span>";

        document.write(commentsHtml);

    }

//]]>

</script>

<!--Recent comment-->

<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=allbloggertricks_recent&amp;&amp;max-results=50">

</script>

Như vậy là bạn đã có thêm tiện ích mới vào website của bạn rồi đó. Chúc các bạn thành công.