An unobtrusive badge for Google Reader’s shared items
Wednesday, May 21st, 2008 at 8:00 pmI am a user of Google Reader to get through the vast amounts of RSS feeds I subscribed to. I think it is safe to say that reading RSS and twittering has replaced most of my web surfing.
Like most big RSS readers, Google reader also allows you to share great finds you had with people who want to and are in your social neighbourhood. You can either get these finds as a feed or as a little badge (called a clip in Google lingo) to include in your blog or other sites.
The out-of-the-box version of this badge can be customized and results in two JavaScript includes which write out the badge.
That is nice, but I don’t quite care for things that could offer functionality without JavaScript but don’t bother, which is why I checked more closely what the Google badge does.
If you look at the generated script includes you’ll find for example the following URL ( added spaces to avoid breaking my blog :) )
Clicking this will get you a JSON object with a wrapper function (and for some reason a comment that this is a JavaScript file), which means you can use this for your own purposes.
All you need is your user ID, which you can get this one easily from your shared items homepage that Google Reader offers. In my case this is http://www.google.com/reader/shared/07479231772993841072.
The other interesting parameters of the JSON API are the n parameter defining the amount of items and the callback parameter defining the name of the function call wrapped around the JSON data.
Putting all of this together it was easy to create a badge that uses the following HTML to show off my shared items on Google Reader.
Visitors without JavaScript will still be able to click through to the page of my shared items. Those with JavaScript will get the latest five.
You can see the badge in action and download it for yourself on the demo page (using tutorialbuilder):
Tags: badge, Google, javascript, reader, unobtrusive, webdevtrick