Displaying RSS feeds easily using Google Ajax Feed API
In this tutorial, I'll show you how to harness Google Ajax Feed API to fetch a RSS feed and display it on your site. Here are a few examples:
|Latest Digg news:||Latest Web design news:|
The 3 minute setup
Step 1: Get your own (free) Google API key instantly, by going to their signup page, and entering your site's domain. A key that is super-duper-long is generated that will work only for that domain.
Step 2: Insert the following script in the HEAD section of your page, which first references Google Code API (required), then loads version 1 (currently the latest version) of Ajax Feed API:
google.load("feeds", "1") //Load Google Ajax Feed API (version 1)
var rssoutput="<b>Latest Slashdot News:</b><br /><ul>"
var feedpointer=new google.feeds.Feed(feedurl) //Google Feed API method
feedpointer.setNumEntries(feedlimit) //Google Feed API method
feedpointer.load(displayfeed) //Google Feed API method
for (var i=0; i<thefeeds.length; i++)
rssoutput+="<li><a href='" + thefeeds[i].link + "'>" + thefeeds[i].title + "</a></li>"
alert("Error fetching feeds!")
You can substitute the RSS feed URL to any valid one and modify the
number of entries to show in a linear fashion. The code in red involves
invoking methods available in Google Ajax Feed API to load/retrieve the
desired RSS feed before outputting the result using your own custom call
back function, in this case,
Now that you know the basic steps to utilizing Google Ajax Feed API, it's time to blow the door open and explain the API in detail and what you can do with it.