January 27, 2009

The Widget Code

Okay, there seems to be some demand for this, so here's the code for the recent comments widget.

Updated to make copying easier and to fix a bug with anonymous commenters: In the end of the script, replace my URL with your own. Then all you have to do is add an HTML/Javascript widget to your sidebar and paste in the text.

You may not see comments right away, as my widget started by reading the comment feed prospectively only, but as people leave more comments, the widget should fill itself out.

Enjoy!

<script type="text/javascript">
<!-- // hide from browsers
//Recent Comments Widget originally by Blogger Templates and updated by Blogger Buster then edited by Ben Zvan for simplicity
function showrecentcomments(json){
for(var i=0;i<show_number;i++){
var feed_raw=json.feed.entry[i];
var comment_link_raw;
if(i>=json.feed.entry.length)break;
for(var k=0;k<feed_raw.link.length;k++) {
if(feed_raw.link[k].rel=='alternate') {
comment_link_raw=feed_raw.link[k].href;break;
}
}
var comment_link=comment_link_raw.split("#");
comment_link=comment_link[0];
var comment_link=comment_link.replace(/\u003d/,"=");
var post_link=comment_link.split("/");
post_link=post_link[5];
post_link=post_link.split(".html");
post_link=post_link[0];
var post_link=post_link.replace(/-/g," ");
post_out=post_link.link(comment_link);
var author_name
if(feed_raw.author[0].name){
author_name=feed_raw.author[0].name.$t;
}
var author_link;
var author_out;
if(feed_raw.author[0].uri){
author_link=feed_raw.author[0].uri.$t;
author_out=author_name.link(author_link);
}else{
author_out=author_name;
}
// Output phase
document.write('<div class="recent-comment">');
document.write(''+author_out+' on '+post_out+'<br/>');
document.write('</div>');
}
}
// -->
</script>
<script style="text/javascript">var show_number=10;</script>
<script src="http://almostdiamonds.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

7 comments:

Unknown said...

Thanks! Works like a charm.

Anonymous said...

Pretty good. Now, can I haz blogroll widget?

Stephanie Zvan said...

Greg, I'm sorry. Blogger set up that widget as an app, which means I don't see the javascript for it, just a GUI interface. You can try digging in the source code for the page to see where it comes from and whether you can get to it that way. That's how I ended up with an editable script for this widget.

Ben Zvan said...

Greg: The blogger code runs on the server side. The recent comments widget should to, but... oh well.

Juniper Shoemaker said...

I too have decided to try this. Thank you for sharing with us!

Nia Lorrier said...

Thank you for the simple but powerful comments widget. Every other ones failed or looked not quite right on my blog except this! :)
Um, btw can I change the small-letter display post subject to normal one? (like when I type "Hello", I want to see it on my R/C widget exactly, not like "hello"....)

Stephanie Zvan said...

Hey, Nia. Unfortunately, the way Google sets up the comment feed, we seem to be stuck with this title format. Sorry.