Monday, June 28, 2010

,

Recent Comments Widget

I wasn't happy with the default Recent Comments Widget from Blogger so I searched for ideas on how to customize it.

(1) Click Design, then Page Elements


(2) Click Add Gadgets


(3) Click HTML/Java Script


(6) Enter the following codes:

<script style="text/javascript">


function showrecentcomments(json) {

  var numcomments = 5;

  var showcommentdate = true;

  var showposttitle = true;


  var numchars = 100;

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;

      }

    }


   alturl = alturl.replace("#", "#comment-");

   var postlink = alturl.split("#");

   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] = "Jan";

   monthnames[2] = "Feb";

   monthnames[3] = "Mar";

   monthnames[4] = "Apr";


   monthnames[5] = "May";

   monthnames[6] = "Jun";

   monthnames[7] = "Jul";

   monthnames[8] = "Aug";


   monthnames[9] = "Sep";

   monthnames[10] = "Oct";

   monthnames[11] = "Nov";

   monthnames[12] = "Dec";


   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, "");

document.write('<br/>');

   if (showcommentdate == true) document.write('On ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday + ' ');


document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented');

   if (showposttitle == true) document.write(' on ' + posttitle);


document.write('<br/>');

if (comment.length < numchars) {

document.write('<i>');


         document.write(comment);

document.write('</i>');}

   else

        {

document.write('<i>');


         comment = comment.substring(0, numchars);

         var quoteEnd = comment.lastIndexOf(" ");

         comment = comment.substring(0, quoteEnd);

document.write(comment + '...<a href="' + alturl + '">(more)</a>');


document.write('</i>');}

document.write('<br/>');

  }

document.write('<br/>');


}

</script>

<script src="http://xyz.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">

</script><a href="http://reviewofweb.com/blogging/recent-comments-blogspot-widget/">Widget </a>by <a href="http://reviewofweb.com/">ReviewOfWeb</a>



(7) Save and you're done!

Thanks to Review of Web for the codes! Happy Blogging!
Share:

0 comments: