Pages

Sunday, October 30, 2011

13

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.
[Hide comments] - [Show comments]
Click on a single comment to hide/show its text

13 comments:

Aratina Cage said... [reply]

It's great to see someone else putting in the time to improve the comment displays available on Blogger.

I did a similar thing some time ago back in 2010, creating a gadget I call Last Comments (last-comments.blogspot.com), but even though I submitted it twice and even got in touch with one of the Blogger developers, they still have not put my gadget in the directory, which kind of frustrates me because, as you document here, the number of things wrong with the gadgets they do list (Recent Comments and Top Comments are the exact same gadgets with different names) is astounding. The only reason I even started building my version was because I had grown tired of seeing #39; everywhere! LOL.

Anyway, I love how you eventually made this recent comments gadget of yours capable of showing avatars. Nice touch!

MS-potilas said... [reply]

@Aratina Cage Hi, and thank you for your comment. Your recent comments gadget seems very professional. I understand your frustration about Blogger not putting it in the gadget directory, hopefully they'll eventually do.

Yeah those 's were one reason for me, too, I had already forgotten those...

GnC said... [reply]

This is a nice gadget, but it will not translate comments. So far, I have not been able to find a recent comments widget that will allow the Google translator to translate the comments. Any suggestions, anyone?

(http://vandredagbog.blogspot.com)

Mirela said... [reply]

Thanks for the gadget. It works great. What should I do to see the posttitles?

MS-potilas said... [reply]

@Mirela Hi, I suggest you use the newest version of my recent comment gadget, the son of better recent comments gadget. There you can use [title] in txtWrote variable, and [title] will be substituted by the post title.

@GnC: In my MS-potilas blog I have the newer version of this gadget, and Google Translator seems to be able to translate the texts (I have a translator gadget in the side bar).

Mirela said... [reply]

Thanks, again. I am not an expert and I was not able to do the change.
I would like to have: [author] "in" [posttitle] (without the text of the comment).

Unknown said... [reply]

plz i want to help me about how add demo watch to my blogger
http://seo-dz.blogspot.com

Kristen said... [reply]

Thank you so much for the fix. It's working great on my blog!

Anonymous said... [reply]

Thank you very much. This works very well on my blog ! It is definitely better than the old gadget.

Anonymous said... [reply]

nice tricks..

Ismail Sosse Alaoui said... [reply]

Hi MS-potilas, how are you? hope you are in good health.
Bref, like you know the great bug of pagination in blogger system comments
(in-reply-to) i have a suggestion to resolve the problem just on "Recent comments gadget for Blogger".
We can correct comment redirection link:

for posts's comments numbers less than 200 comment: change this
/2013/10/blog-post_25.html?showComment=1383053285385#c2719937441379252035 to /2013/10/blog-post_25.html#c2719937441379252035,
for posts's comments numbers more than 200 comment: change this
/2013/10/blog-post_25.html?showComment=1383053285385#c2719937441379252035 to /2013/10/blog-post_25.html?commentPage=2#c2719937441379252035
hope you understand me.
best regardes
Ismail

MS-potilas said... [reply]

@Ismail SOSSE ALAOUI
I'm afraid I don't know any feasible way to do this. The comments feed does not contain the "comment number" information. The only way I can think to get this info is to read also the comment feed of a particular post. I think pure javascript based solution would be very slow. One possible solution would be to make a Google appengine application, which would read the comment streams and also "remember" the comment indexes. But it is bit like shooting a fly with a cannon.

My opinion is that Google should fix the linking problem :) Hopefully they some day do. If the whole Blogger does not get moved to Google+ or something like that.

James oliver said... [reply]

Global dezigns is the website development company in Karachi, providing web development services We aspire to become the premier IT Company focusing on new realms
Ecommerce website development in Karachi

Post a Comment

Related Posts Plugin for WordPress, Blogger...
See the hack
for this dynamic
views icon: