Hack for my recent comments hack: don't show own comments

Maybe you don't want to show your own comments in recent comments? Here is quick and simple hack for my Son of the better recent comments gadget to make it not show own comments.

Edit the HTML/Javascript gadget. Change lines 93 and 115, which both look like this now:

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

to:

var entry = json.feed.entry[i]; if(entry.author[0].name.$t=="PUT YOUR USERNAME HERE") continue;

Edit your username inside the quotation marks. Save the gadget. Your comments won't be displayed anymore in recent comments.

Small update for recent comments gadgets

I have updated the source code of all three recent comments gadgets today.

1. Bug fix

The gadget choked with comments on blog pages (versus articles). Fix for that was easy, search for line:

postTitle = hrefPost.split("/")[5].split(".html")[0].replace(/_\d{2}$/, "");

and change it to:

if(hrefPost.match(/\/([^/]*)\.html/)) postTitle = hrefPost.match(/\/([^/]*)\.html/)[1].replace(/_\d{2}$/, "");

That line is line number 88 in recent comments gadget, line 138 in return of recent comments gadget, and line number 141 in son of recent comments gadget.

2. Default/empty post title

I also updated this line (line number 85/135/138):

var postTitle="";

to this:

var postTitle="-";

So at least something is displayed, if title cannot be parsed.

3. Better linking to post page comments

In return of, and son of recent comments gadged, I also added this line:

if(!/#/.test(href)) href += "#comments";

It is line 185 in "return of", and line 192 in "son of". With a comment on a page this gets us positioned on top of the comments (versus top of the article). I did not make this update on the oldest gadget, if you're still using it, I suggest you try the latest version, son of the recent comments gadget.

I've updated the source code in the blog articles, you can look up the changes there.

Comments feed changed and Recent comments update

I found out that comments feed no longer contain the direct link (so called "alternate link") to those comments, that the comment author has deleted. I.e. those, where it reads "This post has been removed by the author.". Comments feed used to have links to all comment entries, but no longer does for these deleted ones.

This affected my recent comments gadgets. I have updated their source code in their posts.

Better Recent comments gadget for Blogger: line 69 is modified, line 76 is new.
Return of the Better Recent Comments gadget: line 121 is modified, line 128 is new.
(newest) Son of the better recent comments gadget: line 124 is modified, line 131 is new.

If you experience recent comments disappearing if there is a new author-deleted comment, please update the gadget, just two lines need to be changed. Another quick fix is to permanently delete the author-deleted comment from the blog's admin comments section.

Son of the better recent comments gadget

Here is the newest version of my recent comments gadget (here is the previous version). Previous version still works, so if you have it installed, you don't have to update if you don't want to.

What is new?

Earlier this month Blogger added comment authors' avatar (profile image) urls to comment feed. This new version uses those urls to get the avatars, instead of using my google appengine application to get avatars from profile pages, as the previous version does.

As an added bonus in this new "Son" version, avatar size can be adjusted easier using a configuration variable, and I give you two additional CSS styles for the gadget.

Features of my recent comments gadget

You can configure:

• number of recent comments displayed
• max number of comments per post (so one post's comments don't "flood" recent comments)
• length of comment excerpt
• translation or own version of gadget's texts
• customize what is displayed.

Also:

• blog author's comments can be styled differently (CSS)
• display comment author's site favicon, comment author's Blogger profile image, or mystery man icon (configurable) for non-registered commenters
• does not have the bugs the recent comment gadget that Blogger offers has.

The newest version, "Son of the better recent comments gadget", adds the following new features:

• loads Blogger avatars (profile images) using the new avatar urls in comments feed
• avatar icon size can be more easily configured
• three CSS examples for different size avatars.

The Script

Add a HTML/Javascript gadget to your blog, and paste the following code into it. If you had previous version installed, replace it with this, and make the same configuration changes you made to the previous version. I'm sorry that there is no automated upgrade, but this is no rocket science, I'm sure you can do it. :) Know your way around.

Data provided by Pastebin.com - Download Raw

Script configuration

There are some CSS definitions at first, which can be changed to your liking. After that there comes javascript code and configurable variables. Here is a list of the variables and a short explanation.

numRecentComments: how many comments you want displayed
numPerPost: how many comments per post max is the goal (will fallback when necessary)
maxCommentChars: how many chars max in excerpt of comment
maxPostTitleChars: how long post title can be, or 0 (=don't cut title)
txtWrote: header text, links to comment
txtMore: footer text, links to comment
txtToolTip: text to be shown when mouse hovers over comment
txtAnonymous: "Anonymous" username localized, or empty if English text "Anonymous" is to be used
getTitles: if true, fetch titles from post feed; if false, titles are generated from url
trueAvatars: if true, uses Blogger avatars (Blogger profile images) from comment feed, not just the blogger favico [B]
urlMyAvatar: especially if trueAvatars = false, set here the url to your avatar image
urlMyProfile: if you don't have a profile gadget on page, put your profile url here!
urlAnoAvatar: anonymous avatar, you can change from mystery man to a custom one, if you want, possibly this
maxResultsPosts: can be empty or &max-results=### where ### is number of posts to get from posts feed to get titles
maxResultsComments: empty or &max-results=### where ### is number of comments to get from comments feed

New configurable variables in "Son"

cropAvatar: crop avatar to square (true) or stretch (false) to square
sizeAvatar: size of avatar in x and y direction, pixels
urlNoAvatar: comment feed offers the icon (Blogger logo) for those Bloggers who have not set their profile image. You can override the icon with this setting (default: ).

txtWrote, txtMore and txtTooltip

These can be just normal text. If txtWrote is normal text, it is preceded by commenter name. So if txtWrote is "wrote..." the result would be Jason wrote..., if Jason was commenting.

All texts can also have simple variables, which are: [title], [user], [date], [time], [datetime] and [date format]. [title] is substituted by Post title, where comment belongs. [user] is substituted by commenter name. [date] displays date in current (user's computer's) locale, [time] displays time and [datetime] date and time in user's locale.

format in [date format]

In format some character combinations are substituted:

yyyy=long year, yy=short year, MM=month(01-12), dd=monthday,
hh=hour, mm=min, ss=sec (time/hours in 24-hour clock)

but format can contain also other text/characters (which are displayed as is).

"Written [date MM/dd/yyyy hh:mm]" could become "Written 11/03/2011 08:30".

Again, the script has good configuration defaults, so if all this was too complicated for you, you don't have to care about it. If you don't have a profile gadget on your page, put your profile url in the code I provided, and you're ready to go. If you have a profile gadget, then you don't have to change anything, just copy and paste.

Styles for different avatar sizes

Default size for avatar is 16 pixels. If you change, the CSS might need some adjusting. In the picture in the beginning of this post there are three examples, first the default (16 pixels), then 20 pixel avatars, and then 24 pixel avatars.

Styles for 20 pixel avatars:

...

var sizeAvatar = 20;

Styles for 24 (and larger) avatars:

...

var sizeAvatar = 24;

This gadget is installed on this blog with 16 pixel avatars. My MS-potilas blog has this gadget with 20 pixel avatars.

If you set the urlNoAvatar, you might want to change the icon also in the comments block, where the actual comments are (below the post). I have a hack for that, too, see: Use new blank Blogger profile picture in comments.



Problems in Internet Explorer?

By default many Blogger templates have set Internet Explorer to use EmulateIE7. IE7 emulation has some bug with blog feeds in foreign languages that can make the gadget not show properly. You can fix this by editing the template, find line:

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>

(or something similar with text "EmulateIE7"), and change it to:

<meta content='IE=EmulateIE8' http-equiv='X-UA-Compatible'/>

Update Jan 2nd 2012: Deleted comments (This post has been removed by the author.) no longer have "alternate" link in comment feeds, like they used to, which can cause the recent comments to disappear. I modified the script to prevent this: line 124 is modified and line 131 is new.

June 6th 2012: Optional hack: If you don't want to show your own comments in recent comments, check this hack.

August 1st 2017: To fix avatars, please change lines 157 and 158 (article code is updated).

Return of the Better Recent Comments gadget

Update Dec 29th 2011. You might be interested of the newer version: Son of the better recent comments gadget.
---
Just few days ago I made a javascript gadget for Blogger that displays recent comments similarly to the Recent Comments in Gadget directory, but better. Also has some extra functionality, and bugs fixed, of course.

I did not stop there, I now present the newest "Return of the Better Recent Comments". Who would not like to have recent comments like these two examples? (right one is in Finnish, from my MS-potilas blog)

Features

- all options and features that my previous version had
+
- displays either anonymous (mystery man) icon, site favicon or blogger profile icon
- you can customize "header" and "footer" and tooltip text
- your (blog author) comments can be displayed differently (CSS styling)
- more options to make this suit also bigger blogs
- I think I forgot something...

To get the blogger avatars, I had to make a Python app with Google App Engine (here is the newer, current version), because it is not possible to get them by only javascript. Blogger avatars can be turned off to make gadget run faster, site favicons will then still be used (for example, B icon for Bloggers).

Here is the code. You can put this in HTML/Javascript gadget.

Data provided by Pastebin.com - Download Raw

Configuration

There is some CSS at first, it can be changed to your liking. After that there comes javascript block and configurable variables. Here is a list of them and a short explanation.

numRecentComments: how many comments you want displayed
numPerPost: how many comments per post max is the goal (will fallback when necessary)
maxCommentChars: how many chars max in excerpt of comment
maxPostTitleChars: how long post title can be, or 0 (=don't cut title)
txtWrote: header text, links to comment
txtMore: footer text, links to comment
txtToolTip: text to be shown when mouse hovers over comment
txtAnonymous: "Anonymous" username localized, or empty if English text "Anonymous" is to be used
getTitles: fetch titles from post feed; if false, titles are generated from url
trueAvatars: fetch blogger avatars from profile page, not just blogger favico
urlMyAvatar: especially if trueAvatars = false, set here the url to your avatar image. A bit faster, if set.
urlMyProfile: if you don't have a profile gadget on page, put your profile url here!
urlAnoAvatar: anonymous avatar, you can change from mystery man to a custom one, if you want
maxResultsPosts: can be empty or &max-results=### where ### is number of posts to get from posts feed to get titles
maxResultsComments: empty or &max-results=### where ### is number of comments to get from comments feed

txtWrote, txtMore and txtTooltip

These can be just normal text. If txtWrote is normal text, it is preceded by commenter name. So if txtWrote is "wrote..." the result would be Jason wrote..., if Jason was commenting.

All texts can also have simple variables, which are: [title], [user], [date], [time], [datetime] and [date format]. [title] is substituted by Post title, where comment belongs. [user] is substituted by commenter name. [date] displays date in current (user's computer's) locale, [time] displays time and [datetime] date and time in user's locale.

format in [date format]

In format some character combinations are substituted:

yyyy=long year, yy=short year, MM=month(01-12), dd=monthday,
hh=hour, mm=min, ss=sec (time/hours in 24-hour clock)

but format can contain also other text/characters (which are displayed as is).

"Written [date MM/dd/yyyy hh:mm]" could become "Written 11/03/2011 08:30".

Script has good configuration defaults, so if all this was too complicated for you, you don't have to care about it. If you don't have a profile gadget on your page, put the profile url in the code I provided, and you're ready to go. If you have a profile gadget, then you don't have to change anything, just copy and paste.

As usual, the gadget is installed on this blog.

Note: If you install this on a very high traffic blog (thousands of hits per day), I suggest you to make your own Google App Engine application to get Blogger avatars (see this article), as I'm using the free version and it might get slow on heavy load. I don't know if it will, we'll see. Or if it gets slow, just turn Blogger avatars off (trueAvatars = false), or use the newer version, which does not use the App Engine application.

Problems in Internet Explorer?

By default many Blogger templates have set Internet Explorer to use EmulateIE7. IE7 emulation has some bug with blog feeds in foreign languages that can make the gadget not show properly. You can fix this by editing the template, find line:

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>

(or something similar with text "EmulateIE7"), and change it to:

<meta content='IE=EmulateIE8' http-equiv='X-UA-Compatible'/>

Update Dec 29th 2011. Newer version here: Son of the better recent comments gadget.
Update Jan 2nd 2012: Deleted comments (This post has been removed by the author.) no longer have "alternate" link in comment feeds, like they used to, which can cause the recent comments to disappear. I modified the script to prevent this: line 121 is modified and line 128 is new.

Better Recent comments gadget for Blogger

Update 12/29/11: A new recent comments gadget with avatars is installed on the blog, you might consider using it instead of this gadget.

---

Blogger Gadget directory has two recent comments gadgets, Top Comments by Ziyush and Recent Comments by Blogger Buster, but both suffer from same problems.

Bug: the anchor of the link to the comment is broken. It should be ...showComment=COMMENTID#COMMENTANCHOR but it is ...showComment=COMMENTID#comment-COMMENTANCHOR. When you have many comments, it would be really nice if the link took you to the right comment, not to the top of the page.

Bug: sometimes gadget does not show anything, sometimes load times are long. Annoying.

Bug/feature: Strings cannot be translated. I don't want in my Finnish blog to have texts "wrote..." and "Continue >>", but "kirjoitti:" and "Lue lisää >>" instead.

Bug/cosmetic: styles don't look good, not the same as in blog (for example all links are underlined).

Missing features: CSS cannot be modified. Post titles cannot be used. Customization very limited.

Missing feature: Always gets x number of chronologically latest comments, but what if you wanted the latest comments all from different posts, or if you wanted maximum of 2, or 3, comments per same post, to prevent one topic from "flooding" the recent comments?

Own gadget to the resque

Because of all this, I first used RSS feed gadget for displaying recent comments, until yesterday, when I started developing something better. My goal was to make a gadget, which has working link anchors, customizable CSS styles and allow translating the strings and allow other modifications, too.

Along the way I added the possibility to limit comments count per post to 1...[number of recent comments shown], and that is actually really great. You can also choose not to limit, when the 5 recent comments are fetched regardless of their posts. And, because I think no one had done it before in a javascript gadget, I also fetched the post titles for the comments :) Although I only use those in link titles (shown when user hovers over the link), but you can edit the code and show it in the link, for example, like "Gary commented on We're back in business!...".

Load times are way better and no "blank recent comments" have been detected with my gadged.

To use it, add HTML/Javascript gadget to your blog, and paste following code into it:

Data provided by Pastebin.com - Download Raw

This gadget is installed in this blog, too. In the gadget there are some easily configurable things, and of course you can change anything in the code, if you can...

You can configure CSS styles, number of recent comments (numRecentComments), length of comment excerpt (numCommentChars), maximum comments per post (numPerPost), texts (txtWrote and txtMore), and whether to load titles or not (getTitles; not loading them makes the gadget run yet a tiny bit faster).

If you want to customize the code, you can, but I hope you know your way around and can do it on your own.

Hope you like it! I do, but now I just cannot make up my mind, whether to set numPerPost to 1 or 2, with 5 recent comments... both good choices... Which would you use?

---

Update 11/02/11: This hack is no longer installed in this blog. I developed it further. I will post the new Recent comments in a while, stay tuned.
Update 11/03/11: A new gadget with avatars is installed on the blog.
Update 12/29/11: A new gadget with avatars (fetched differently) is installed on the blog.
Update Jan 2nd 2012: Deleted comments (This post has been removed by the author.) no longer have "alternate" link in comment feeds, like they used to, which can cause the recent comments to disappear. I modified the script to prevent this: line 69 is modified and line 76 is new.