HOWTO : Show an RSS Feed directly into your site | Flavio's blog
 

HOWTO : Show an RSS Feed directly into your site

in webdesign, Web 2.0 & SEO | | 6 Comments » | Last modified:

RSS

Some time ago, I needed to show the information included in a blog, in the category X, directly to the homepage, automatically updated as new articles were written.

If it is easy to read RSS feeds with Feed Reader or, as I do, with iGoogle, is slightly more complex display them in a web page.

This can come in handy this script Dinamyc Drive, blend of java, php e css.

The sample number 1 page, is preferable for easy cleaning and, but there is nothing to choose the other box for more advanced control of Feed.

First of all, zip file to be downloaded this address, and uploaded into a folder of your choice on your server.
Must be set for CHMOD 775 the 777 the folder / rssbox / cache, so as to give permission to read / write to the script.

Open the file rssbox / rssdisplaybox.js and comment the line

var rssoutputscript="rssbox/main.php"

and add this code right after:

rssoutputscript="http://"+window.location.hostname "/subdir/rssbox/main.php

substituting in place of SUbdir, the name of the folder where you uploaded the script rssbox.

Open the file rssbox / main.php and locate the code:

$= array rsslist(
"cssdrive" => "http://www.cssdrive.com/index.php/news/rss_2.0/",
"bbc" => "http://newsrss.bbc.co.uk/rss/newsonline_uk_edition/front_page/rss.xml",
"nytimes" => "http://www.nytimes.com/services/xml/rss/nyt/HomePage.xml",
"dynamic drive" => "http://www.dynamicdrive.com/export.php?type=new" //no trailing comma after last RSS URL!!
);

Here should be included in RSS feeds that interest you (then you choose which you want to show)

Here we are at the last step: go to the page where you want to display the feed, and insert nell'HEAD:

<link rel="stylesheet" type="text/css" href="folder / rssbox / rssdisplaybox.css" />
<script type="text/javascript" src="folder / rssbox / virtualpaginate.js"></script>

<script type="text/javascript" src="folder / rssbox / rssdisplaybox.js">

/***********************************************
* RSS Display Boxes- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

and, the exact spot where the box should appear with the news, This code:

<script type="text/javascript">
//MAIN FUNCTION: rssdisplaybox("rssfeed_id", "rssbox_id", "rssbox_class")
var cssdrivebox=new rssdisplaybox("cssdrive", "cssdriveid", "someclass")
cssdrivebox.set_items_shown(5) //Fetch and display first 5 entries
cssdrivebox.set_template("default") //Use "default" template, which outputs title + description + date
cssdrivebox.start() //Required: start script
</script>

At this point, After choosing whether customize the look by changing the style sheet. css, you can go and see the result!

Here's an example with the latest news from Corriere.it:

Feed RSS di Corriere.it mostrati in una web page, click per ingrandire

RSS feed Corriere.it displayed in a web page, click to enlarge

Someone else had a similar need? This code fully satisfies your needs?

 

6 Comments »

Please accept third-party cookies to be able to comment on the post! The CHANGE COOKIE CHOICES button is located in the footer of the site. / In order to comment this post, please accept the third party cookies! The button CAMBIA LE SCELTE DEI COOKIE is in the footer of the website.