A Great Way To Get Your RSS Feed On Your Static Website

I know it has been a while and this blog is suppose to be mainly about web design, however as titled it is really about my life experiences as well as experiences with web design. So with that said, here is a web design topic that is pretty hot. RSS, Really Simple Syndication, is one of those buzz Web 2.0 items that has even worked its way into the new windows (Vista). RSS is more or less a coding language that codes news stories in XML, eXtensible Markup Language, so they can be dynamically implemented into web and now desktop applications. In this technology error, it is critical to get the latest news at a moments notice. Now with RSS, people can encode a news feed for their business or organization and persons interested in that news can subscribe to the feed and get the news dynamically on there desktop with Vista or on their home page on Google.

This technology integrates perfectly with a dynamic website CMS, content management system, such as a blog. As you write a news story or blog post as I am at the moment and then publish it, most CMS systems such as Drupal or Word Press will use a plug-in, widget, to encode that post or entry in the sites RSS. Now instantly people can read the latest news and posts! The problem becomes with static websites that still are authored to this day, how can they play with this new hot dynamic technology. I ran into that very issue recently with one of my clients static website and found the answer with one of the best web resources there is: Dynamic Drive DHTML. There RSS Display Box is by far one of the best solutions I found to solve the problem.

The issue was how can I make a dynamic element with a static website? So I figured the easiest way to solve the problem was to have the dynamic element tell the static website what to do. By doing so I could have the news stories expressed dynamically through RSS and then use the Dynamic Drive Java-script to display that dynamic data solving the issue entirely. This new method of web design is known as AJAX or Asynchronous JavaScript and XML. More or less it integrates all of the popular web languages (Java-Script, XML, and XHTML (HTML) as well as CSS) to accomplish interactive and dynamic web 2.0 technologies in a usable and fast manor. With that said Dynamic Drive once again pulled through for me with this great code.

Of course I had to add in a couple of edits to cater to my needs. I am a web standards buff and in order to allow the news stories to display in a list, I would have to add in the UL or OL tags inside the Java Script it self. So if you too want a valid list heres how. First open up (outputbody.php). This is located in the rssbox folder and manages the templates that will display your feeds on your page. In this file you will have to add LI tags enclosing the template so that it generates the list :

function outputbody($item, $template=""){
if ($template=="" || $template=="default"){ //DEFAULT TEMPLATE ?>
<li> // Insert the list item to add each item as a list item
<DIV class=”rsscontainer”>
<div class=”rsstitle”><a href=”<?php echo $item->get_permalink(); ?>” class=”extlink”><?php echo $item->get_title(); ?></a></div>
<div class=”rssdescription”><?php echo $item->get_description(); ?></div>
<div class=”rssdate”><?php echo $item->get_date(’d M Y g:i a’); ?></div>
</DIV>
</li> // Insert the close tag for the list item after the RSS item template layout
<?
} //end default template


The the last thing you have to do is define either a UL or a OL for your list type in the page that controls the entire feed and template integration in the file called (main.php) also located in the rssbox folder. Here I created a small IF statement to trigger an echo command to insert the UL or OL tags depending which template is used in the outputitems function:


function outputitems(){
if ($template=="" || $template=="default") echo '<ul>'; // Added in an IF statement to trigger an insert of a UL if the default template is used
global $feed, $feednumber, $templatename;
$max = $feed->get_item_quantity($feednumber);
for ($x = 0; $x < $max; $x++){
$item = $feed->get_item($x);
outputbody($item, $templatename); //call custom outputbody() function
}
if ($template==”" || $template==”default”) echo ‘</ul>’; // Added in another IF statement to trigger an insert of the close tag for the UL
}


There you go, simple as pie. A great way to get your dynamic RSS feed on your static web page with a little tweak. ENJOY….

Tags: css, java-script, rss, sem, seo, xml

This entry was posted on Tuesday, June 12th, 2007 at 10:12 pm and is filed under Web Design. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.