Insert a Twitter or RSS Feed Add-in by Ian Haynes

I recently posted on my blog, Insert A Twitter Feed Add-in which covers Ian Haynes add-in. Ian has updated the add-in to include inserting not only a Twitter Feed but a RSS Feed as well.

To insert a RSS Feed as part of your site

Step 1: Open your page and place your cursor where you want the RSS Feed to appear. From Insert on the menu, select Twitter or RSS Feed.

On the next screen, select RSS Feed.

Step 2: Insert the following in the dialog box:

• Type the Feed url
• Type the Feed width on page. This can be in pixels, ems’s or percentages. The default is 400px.
• Select if you want the Header to show - The default is Yes
• Select the heading level for the Title tag: The default is h4.
• Select if you want the Date to show - The default is Yes.
• Select if you want the Content to show - The default is Yes.
• Select if you want the Snippet to show - The default is Yes.
• Type the No of Feeds to Show: The default is 4 if left empty.
• Select the Preview button and you will see the Preview of your RSS Feed.
  
• Save the Page and the embedded files.
  
• You can then Preview your page in your favorite browser and see your RSS Feed where you requested it be placed. No complicated code to write and your page should validate if the rest of the code is valid. Publish your page and your RSS Feed will now be part of that page.

The following code will be added to the head section of your page:

<link rel="stylesheet" type="text/css" href="ew_rssfeed.css" />
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.zrssfeed.min.js"></script>
<script type="text/javascript" >
$(document).ready(function () {
$('#ewFeed').rssfeed('http://huuweb.org/community-cafe/feed/', {
limit:4,
date:true,
content:true,
header:true,
titletag: 'h4',
snippet:true
});
$('#ewFeed').css({'width': '400px'});
});
</script>

You can change the styles for the feed by editing the ew_rssfeed.css file

Thank you Ian. Great new tool and easy to use.  Download Insert A Twitter Feed Add-in.

Visit Ian’s site Expression Web Resource.

Copyright © 2011 Pat Geary of Expression Web Tutorials & Templates All Rights Reserved
Tutorial Added January 2011