Setting up the RSS News Feed XSL Stylesheet

Adding an RSS Feed to the standard DotNetNuke® RSS News Feed module is an easy process, the confusion begins once you have added the feed and your page doesn’t display in the way you intended. Quite often it displays the actual HTML tags rather than a nicely formatted page.

In order to display an RSS feed in the formatting you require; you need to use a XSL transformation file (named News Feed Style Sheet in the RSS News Feed Module).

The RSS News Feed module comes with a default XSL transformation file compatible with RSSv0.91.  While the default XSL will work with some news feed sources, if the RSS feed you wish to display is using a different version of RSS, such as RSS2.0, the feed will not display using the correct formatting.

To configure the RSS News Feed module so that it displays a nicely formatted page, you need to create a compatible XSL transformation file with the RSS Feed you wish to display.

Here we are going to show you the basics for creating an XSL transformation file.

Step One - Allowing the display of HTML

The RSS News Feeds module comes as standard with an XSL transformation file called RSS91. You will find it in the following folder of your DotNetNuke portal:

 \DesktopModules\News\RSS91.xsl

You have two options:

1. Edit the default RSS91.xsl file
2. Create a new xsl transformation file, upload and select the new XSL file in the RSS News feed module settings

If you use option 1, any new RSS feeds you add will as default use the new RSS91.xsl file settings that you created, therefore if you know that the majority of the RSS feeds you wish to display in your website are in the RSS2.0 format, you could edit this file to save you configuration time.

We are going to use option 2 to walk you through the full process.

This is a simple process.

1. Create a copy of the RSS91.xsl file
2. Name the file to an appropriate name eg. “RSSDisplayHtml.xsl”
3. Open the new .xsl file in Notepad
4. Change this line:

To:

Step Two - Uploading the XSL transformation file

Once you have created your XSL file, you need to upload it to your DotNetNuke portal.

In the module settings of the RSS News Feed Module, select Edit News Feed:

1. Under News Feed Style Sheet, select “Link Type: File (A File On Your Site)”
2. Click on Upload New File
3. Upload the new XSL file
4. Click on Update

The RSS News Feed Module should now display the RSS Feed with the correct HTML formatting.

Click here to download example 1: RSSDisplayHtml.xsl file
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

Click here to view example 1: An RSS feed with HTML enabled and an RSS feed using the default XSL Transformation file

Let’s look at some of the further options available for adjusting the XSL transformation file.

Further Options

It should be noted that there are several methods for achieving these tasks, here are a few examples to get you started:

Selecting the Elements to Display

To begin with, let’s view the source of an RSS file:

I found the RSS feed below using: http://www.moreover.com/rss this feed is the Human Resources News. Click on the link below to view the RSS feed:

http://p.moreover.com/cgi-local/page?o=rss002&c=Human%20resources%20news
Within the RSS Feed, the content is surrounded by TAGS, if we start at the top of the feed, we can see that it states the format of the feed, in this case RSS2.0: Following this are the actual details of the feed with the: Main title, link, feed description, language, and image.

Underneath this follows each News Item consisting of: Title, link, description, guid, pubDate, and source url.

Each RSS feed can contain different elements, for instance; it may also contain an author TAG, or an extended description etc.

The advantage of using XSL transformation files is that we can choose which elements from the RSS feed we wish to display.

To display an element, use the following: (Replace "pubDate" with the TAG element you wish to display from the RSS feed)

In this example, we have set the transformation file to just display the main title and publish date, we are not displaying the description. You will also note that we have italicised the publish date.

Click here to download example 2: RSS_Title_No_Description.xsl
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

Click here to view example 2: An RSS Feed displaying just the title and publish date

---

Limiting the number of News Items displayed

Quite often, a RSS Feed will contain more items than you require, here we will demonstrate how you can limit the number of RSS Items that you wish to display.

You can limit the number of items using:
If the position within the RSS feed is less than item number 6, then continue and display the following elements. This will display the first 5 items in the RSS feed.
You can also use:
Which selects the first 5 items from the RSS feed.

---

Removing the advertisements from the beginning of an RSS feed

moreover.com place an advertisement in the first item that is listed in the RSS feed. If you combine the two statements from above you can specify to select the News Items that are greater than 1 – ie. From News Item no. 2 – therefore skipping the advertisement. And then from these News items that are left select 5 of those items:


Click here to download example 3: RSS_limit_number.xsl
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

Click here to view example 3: An RSS Feed limited to 5 items with advertisements removed

---

Opening Links in a new window

If you wish to open the links from the RSS feed in a new window, all you need to do is change:
to
eg:

---

Further examples:

Displaying the feed details, image and limiting the width

This example demonstrates how to display the RSS Feed main title, description and image. It places a horizontal rule in between each News Item and also limits the width of each item to 500 pixels.

Using the moreover.com RSS feed, if you do not limit the width of each item, the description is displayed on one line, which forces the user to scroll across the page to view the description.

Click here to download example 4: RSS_MainTitle_Images.xsl
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

Click here to view example 4: An RSS Feed with main title, description, image and rule

---

ASP.NET forum - Limiting the formatting and description text

This example can be used to display the RSS feed from the asp.net forums. If you visit the main DotNetNuke forum: http://forums.asp.net/90/ShowForum.aspx at the bottom right hand side you can copy the RSS feed link.

In this example we display the main feed title, followed by the latest posts. The latest posts consist of the title, date posted, created by and description. Each item is separated by a horizontal rule.

The description in this case is limited to 100 characters to act as a summary for the item.

For each item I have also forced the formatting to display in the verdana font at size 1 using the <font> tags. I have used the font tag rather than the <div> tag to call a css class because the posts from the forum are coming from the general public, who have the option to format their posts. I found that formatting the posts using the <div> tags was not always 100% successful and that the only way to ensure correct formatting was to use the <font> tag.

This is an important point: Check the source of your RSS feeds before displaying them on a live website, if the source is being created by the general public you will want to ensure that the formatting and content is 100% correct before displaying the feed on a live website.

Click here to download example 5: RSS_Forum_Feeds.xsl
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

Click here to view example 5: An RSS Feed with limited description and formatting

---

Formatting the Date

To format the date, you treat the date as a string and take the substrings you want to use from the <pubDate> tag. 

If we check the formatting of the <pubDate> in the RSS feed from moreover.com, the <pubDate> displays:

You can grab the substrings using the following:

You display the formatted date using:

The output of this will be "Oct 24, 2005"

Click here to download example 6: RSS_MainTitle_Images_Date_Formatted.xsl
(this is a zip file, you need to extract the file before uploading it to your DotNetNuke portal)

---

DNN Creative Magazine

If you wish to display any of the articles, tutorials, videos, latest information, modules etc created by DNN Creative Magazine on your website, click here to view the various DotNetNuke RSS feeds that are available. All you need to use for your transformation file is example 1 – to allow HTML.

---

Further information

Here you can view further articles related to XSL transformation files:

This provides a table of the XSL TAGS that are available.

Here is an article created by msdn magazine on XSL transformation files

W3Schools also provide further information and tutorials for XSL transformation files

You can also ask questions regarding the News Feeds module in the DotNetNuke News Feed Module projects forum

---

Credits

Thank you to Phil 'iwonder' Guerra, Stefan ‘CShark-dnn’ Cullmann, and ‘jeewun’ for providing the starting points to the XSL transformation files used in this tutorial - taken from posts in the asp.net forums.