Tiện ích Nhận xét mới nhất có icon đại diện

Lấy ý tưởng từ tiện ích Nhận xét mới nhất có ảnh đại diện (Recent Comments with Thumbnail Widget), tôi điều chỉnh một chút về code để tạo ra tiện ích Nhận xét mới nhất có icon đại diện (Recent Comments with Icon Widget).

Tiện ích Nhận xét mới nhất có icon đại diện hiển thị những nhận xét mới nhất kèm theo icon đại diện của người nhận xét, bao gồm Admin, không phải Admin và nặc danh (Anonymous).

Xem Demo.

Để cài đặt tiện ích này vào Blog của bạn, chỉ cần đặt toàn bộ phần code dưới đây vào một tiện ích HTML/Javascript là OK.

<style type='text/css'>
.textcom {margin: -20px 0 0 0;border-bottom: 1px dashed #88B3C3;}
</style>
<script type="text/javascript">
function showrecentcomments(json) {
for (var i = 0; i < numcomments; i++) {
var entry = json.feed.entry[i];
var alturl;

if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
alturl = entry.link[k].href;
break;
}
}
var photoslink=new Array()
photoslink[0]='<img src="http://bit.ly/hgfpUN"/>';
admin='<img src="URL_icon đại diện Admin"/>';
anonymous='<img src="http://img530.imageshack.us/img530/3443/anonymous.png"/>';

alturl = alturl.replace("#", "#");
var postlink = alturl.split("?showComment=");
postlink = postlink[0];
var linktext = postlink.split("/");
linktext = linktext[5];
linktext = linktext.split(".html");
linktext = linktext[0];
var posttitle = linktext.replace(/-/g," ");
posttitle = posttitle.link(postlink);
var commentdate = entry.published.$t;
var cdyear = commentdate.substring(0,4);
var cdmonth = commentdate.substring(5,7);
var cdday = commentdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "tháng 01";
monthnames[2] = "tháng 02";
monthnames[3] = "tháng 03";
monthnames[4] = "tháng 04";
monthnames[5] = "tháng 05";
monthnames[6] = "tháng 06";
monthnames[7] = "tháng 07";
monthnames[8] = "tháng 08";
monthnames[9] = "tháng 09";
monthnames[10] = "tháng 10";
monthnames[11] = "tháng 11";
monthnames[12] = "tháng 12";
if ("content" in entry) {
var comment = entry.content.$t;}
else
if ("summary" in entry) {
var comment = entry.summary.$t;}
else var comment = "";
var re = /<\S[^>]*>/g;
comment = comment.replace(re, "");
if (!standardstyling) document.write('<div class="bbrecpost">');
if (standardstyling) document.write('<br/>');
if (showcommentdate == true) document.write(' ' + cdday + ' ' + monthnames[parseInt(cdmonth,10)] + ' năm ' + cdyear + ' ');

if( entry.author[0].name.$t == 'Tên bạn'){ document.write(admin)}
else{
if( entry.author[0].name.$t == 'Anonymous'){ document.write(anonymous)}
else{document.write(photoslink)}
}
document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + ':' +'</a> ');
if (showposttitle == true) document.write(' on ' + posttitle);
if (!standardstyling) document.write('</div><div class="bbrecpostsum">');
if (standardstyling) document.write('<div class="textcom"><br/></div>');
if (comment.length < numchars) {
if (standardstyling) document.write('<i>');
document.write(comment);
if (standardstyling) document.write('</i>');}
else
{
if (standardstyling) document.write('<i>');
comment = comment.substring(0, numchars);
var quoteEnd = comment.lastIndexOf(" ");
comment = comment.substring(0, quoteEnd);
document.write(comment + '...<a href="' + alturl + '">(Đọc thêm …)</a>');
if (standardstyling) document.write('</i>');}
if (!standardstyling) document.write('</div>');
if (standardstyling) document.write('<br/>');
}
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('<br/>');
if (!standardstyling) document.write('</div>');}

</script>
<script type="text/javascript">
var numcomments = 7;
var showcommentdate = false;
var showposttitle = false;
var numchars = 200;
var standardstyling = true;
</script>
<script src="http://huynh-nhat-ha.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script></div>
<div class='clear'></div>

Bạn cần điều chỉnh những chỗ được đánh dấu màu đỏ. Bạn cần thay URL cho ảnh đại diện của bạn là Admin; có thể thay đổi số nhận xét được hiển thị (numcomments).

Ngoài ra, chú ý các dòng code sau:

if( entry.author[0].name.$t == 'Tên bạn'){ document.write(admin)}
else{
if( entry.author[0].name.$t == 'Anonymous'){ document.write(anonymous)}
else{document.write(photoslink)}
}

Nếu bạn muốn thêm icon cho một người nào đó thường xuyên nhận xét trên blog của bạn (lấy ví dụ tên người đó là Minh) thì thêm vào như sau:

if( entry.author[0].name.$t == 'Tên bạn'){ document.write(rosa)}
else{

if( entry.author[0].name.$t == 'Minh'){ document.write(minh)}

else{

if( entry.author[0].name.$t == 'Anonymous'){ document.write(anonymous)}
else{document.write(photoslink)}
}

}

Sau đó thêm vào đoạn code chỉ định icon với dòng sau:

minh='<img src="URL_icon của Minh"/>';