Download RSS box script

Demo

Download files

You can download the entire project from this zip file.

Files included in package

rss-box.html = The main HTML you open in your browser
js/ajax.js = Ajax (SACK library)
readRSS.php = File that reads RSS data from a source. rss-box.html uses Ajax to retreve data from this file.
lastRSS.php = RSS parser download from http://lastrss.webdot.cz/

Setup

Server side support

This script requires that you have access to PHP on your webserver.

Creating RSS box and specify url of feed

This scripts loads content from an external RSS file into a div on your page. The first you have to do is to put in an empty div where you want the RSS box to appear. Example:

Then you need to specify

The url to your RSS source
Which div you want the RSS data to be placed
How many items you want to read from the source
Time between each item is shown in the box.

All this is something you specify by calling a Javascript function named "insertAjaxContent". Example:

insertAjaxContent('rssBox','http://www.dhtmlgoodies.com/rss/dhtmlgoodies.xml',5,3);

"rssBox" refers to the empty div you created, Then we have the url to the external RSS feed. I have specified that I only want the 5 newest items to be shown and the script should show an item for 3 seconds before switching to the next one.

Layout

The script uses plain CSS for the layout. This is the CSS for the demo:

#rssBox{
  width:300px;
  margin:5px;
  float:right;
  height:300px;
  border:1px dotted #317082;
  padding:3px;
  font-size:0.8em;
  background-color:#E2EBED;

}
.rssBoxDate{
  display:none;  /* I don't want to show the date */
}
.rssBoxHeading{  /* Heading of RSS item */
  font-weight:bold;
  color:#317082;
  margin:0px;
}
.rssBoxDescription{  /* Description of RSS item */

}
.rssBoxLink{  /* Read more link */
  color:#F00;
  text-decoration:none;
}
.rssBoxLink:hover{  /* Read more link - mouse over */
  text-decoration:underline;
}

Javascript variables

You have two Javascript variables available:

var rssBoxTxt_readMore = 'Read more';
var rssBoxOpenLinksInNewWindow = true;

rssBoxTxt_readMore = Link label, i.e. the "Read more" link.
rssBoxOpenLinksInNewWindow = Open "Read more" links in new window or not. true = new window, false = same window