Thêm nhận xét mới nhất cho blogspot

Hiện nay tiện ích nhận xét mới cho blogger, blogspot được chia sẻ rất phổ biến nhưng để có một tiện ích nhận xét đẹp và không làm ảnh hưởng tới tốc độ blog thì lại rất hiếm. Với tiêu chí đẹp và load nhanh thì đây là một lựa chọn hoàn hảo nhất. Để chứng mình về tốc độ load nhanh: "Trăm hat không bằng một thấy" mời bạn vào demo sống bên đưới để mục sở thị tốc độ của nó.

Live demo

Tính năng: 

Hiển thị avata tích hợp với hệ thống gravatar toàn cầu, hiển thị tên người nhận xét, đoạn trích nội dung nhận xét, tùy chỉnh dễ dàng...

Thực hiên:

Video hướng dẫn: Thêm tiện ích mới vào cấu hình HTML/JavaScript cho blogspot/blogger
Đăng nhật vào blog của bạn - Chọn blog muốn thêm tiện ích - Chọn bố cục - Chọn thêm tiện ích mới - Tìm chọn HTML/Javascript và copy đoạn code bên dưới và thên vào lưu lại là ok!

Tùy chỉnh:
Thay đổi thông số:
numComments = 5 (Số lượng nhận xét, bình luận muốn hiển thị)
avatarSize = 30 (Khích thước ảnh avata 30X30)
characters = 40 (Số ký tự tóm tắt nội dung bình luận, nhận xét)

<style type="text/css">
ul.vnblogexpress_recent_comments {
    list-style: none;
    margin: 0;
    padding: 0;
}
.vnblogexpress_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;
}
.vnblogexpress_recent_comments li .avatarImage {
    padding: 1px;
    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 {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.vnblogexpress_recent_comments li img {
    padding: 0px;
    position: relative;
    overflow: hidden;
    display: block;
}

.vnblogexpress_recent_comments li span {
    margin-top: 4px;
    color: #666;
    display: block;
    font-size: 12px;
    font-style: italic;
    line-height: 1.4;
}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 30,
 roundAvatar = true,
 characters  = 40,
 showMorelink = false,
 moreLinktext = "More »",
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
//]]>
</script>
<script type='text/javascript'>
eval(function(d,e,a,c,b,f){b=function(a){return(a<e?"":b(parseInt(a/e)))+(35<(a%=e)?String.fromCharCode(a+29):a.toString(36))};if(!"".replace(/^/,String)){for(;a--;)f[b(a)]=c[a]||b(a);c=[function(a){return f[a]}];b=function(){return"\\w+"};a=1}for(;a--;)c[a]&&(d=d.replace(RegExp("\\b"+b(a)+"\\b","g"),c[a]));return d}('7 D=D||5,9=9||19,A=A||1a,m=m||"h://W.S.g/16/?d=18",E=E||" 1p &1f;",v=(p v===\'o\')?j:v,z=(p z===\'o\')?Z:z,n=(p n===\'o\')?j:n,M=(p M===\'o\')?Z:n;1l 12(L){7 b;b=\'<Y C="12">\';H(7 i=0;i<D;i++){7 x,y,2,k;4(i==L.14.8.q)1g;b+="<X>";7 8=L.14.8[i];H(7 l=0;l<8.I.q;l++){4(8.I[l].1j==\'1o\'){x=8.I[l].w}}H(7 a=0;a<8.K.q;a++){y=8.K[a].1i.$t;2=8.K[a].1h$1k.N}4(2.f("/O/")!=-1){2=2.u("/O/","/s"+9+"-c/")}e 4(2.f("/T/")!=-1){2=2.u("/T/","/s"+9+"-c/")}e 4(2.f("/U-c/")!=-1&&2.f("h:")!=0){2="h:"+2.u("/U-c/","/s"+9+"-c/")}e 4(2.f("G.g/B/1n-P.J")!=-1){2="h://3.13.Q.g/-1m-1e/17/1c/1b/s"+9+"/15.R"}e 4(2.f("G.g/B/1d-P.J")!=-1){2="h://3.13.Q.g/-1R/1U/1P/1K/s"+9+"/1J.R"}e 4(2.f("G.g/B/1M.J")!=-1){4(m.f("S.g")!=-1){2=m+"&s="+9}e{2=m}}e{2=2}4(v==j){4(n==j){k="1O"}e{k=""}b+="<V C=\\"1T "+k+"\\"><B C=\\""+k+"\\" N=\\""+2+"\\" 1H=\\""+y+"\\" 1w=\\""+9+"\\" 1I=\\""+9+"\\"/></V>"}b+="<a w=\\""+x+"\\">"+y+"</a>";7 11=8.1v.$t;7 6=11.u(/(<([^>]+)>)/1u,"");4(6!=""&&6.q>A){6=6.1r(0,A);6+="&1s;";4(z==j){6+="<a w=\\""+x+"\\">"+E+"</a>"}}e{6=6}b+="<r>"+6+"</r>";b+="</X>"}b+=\'</Y>\';7 F="";4(M==j){F="10:1F;"}b+="<r 1G=\\"1E-1D:1A;10:1B;1C-1S:1z;"+F+"\\">1y 1t<a w=\\"h://W.1x.1L/\\">1Q</a></r>";1N.1q(b)}',
62,119,"  authorAvatar  if  commBody var entry avatarSize  commentsHtml   else indexOf com http  true avatarClass  defaultAvatar roundAvatar undefined typeof length span   replace showAvatar href commentlink authorName showMorelink characters img class numComments moreLinktext hideCSS blogblog for link gif author vnblogexpress hideCredits src s1600 rounded blogspot png gravatar s220 s512 div www li ul false display commHTML vnblogexpress_recent_comments bp feed vnblogexpress_blogger_logo avatar TxMKLVzQ5BI mm 60 40 QYau8ov2blE AAAAAAAABYY openid16 1X32ZM raquo break gd name rel image function AaI8 b16 alternate More write substring hellip by ig content width way2blogging Widget right 10px block text size font none style alt height vnblogexpress_openid_logo 8iasY0xpLzc org blank document avatarRound AAAAAAAABYc Way2Blogging 9lSeVyNRKx0 align avatarImage TxMKMIqMNuI".split(" "),
0,{}));
</script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=vnblogexpress_recent_comments&max-results=5"></script>