RSS Content into Your Dreamweaver Web Pages with RSS Replay
By Ronald Northrip
RSS -- Really Simple Syndication -- is about sharing content with new audiences.
Lots of websites create RSS feeds so that their audiences can get updates using
their favorite Aggregators (like NetNewsWire). Other websites collect that content
and republish it in new venues, to new audiences, or just in a different medium.
There are basically two different scenarios where you're likely to want to
republish RSS content into a web page. First, if you have a feed -- what I'll
call a local feed -- you may want to provide it in HTML as well for people in
your audience who aren't subscribed. Second, you'll want to replay content from
someone else's feed so that you can keep your audience up to date on hot topics
across the internet (RSS publishers are OK with this -- just rememebr to attribute
the content to them).
This tutorial will show you how to do both of these things with RSS Replay
-- a Dreamweaver extension I created.
What You'll Need
First you'll need to download and install the RSS Replay extension. You can
get the extension from the RNSoft website at
You install RSS Replay using the Extension Manager application that came
with your copy of Dreamweaver. All you should have to do is double-click the
MXP file that you downloaded and Extension Manager should launch and ask you
if its OK to install. You may need to restart Dreamweaver after installing the
extension but you don't need to restart your computer.
Second, I've written a few example files that you'll want to use so download
them from the RNSoft website as well
Once you have downloaded the example files and unzipped them you will have
a directory called "RRSTutorialSpace" that contains a few files. You'll use
that directory as the root directory for a website in Dreamweaver. So the next
step is to launch Dreamweaver and setup a website with "RRSTutorialSpace" as
the local root.
You will have to define this as a new website within Dreamweaver. I called
the site "RSSReplayTutorial". You may need to provide both local and
remote information, if you plan to replay remote content. Since that's what
we're planning to do, and because remote feeds requires server-based proxy scripts,
you'll need to configure Dreamweaver for your webserver. RSS Replay does not
move anything to the server automatically for you, it works on local files only
-- and then when you're ready you can move them to the remote server.
Replaying a Local Feed
Say you've got this website about Outer Space called "Space News" and you publish
an RSS feed of the active issues in the Space community. You want to put your
feed ("spacenews.rss") onto your web page ("spacenews.html").
So begin by opening the "spacenews.html" file in Dreamweaver.
Select the text that says "Put Replay Here" and delete it. In its place we
will put an RSS Replay. Depending on your version of Dreamweaver the icon for
RSS Replay is the Insert panel's Media tab or the Media popup in the Common
tab (wherever you would normally find the icon for Flash or ActiveX).
Click the icon to insert an RSS Replay. An icon is inserted into your layout
indicating that you now have a Replay. With that icon selected you should now
see the RSS Replay Propery Inspector. We'll use the property inspector to configure
the RSS Replay.
The property inspector allows you to specify the sources (the URLs of the feed),
the CSS style for displaying the content (headlines and stories), the format
for display, and the method of transferring the feed.
The next thing you need to do is specify the source of the content you want
to display. The feed is an RSS file called "spacenews.rss". Put that into
the list of sources by clicking the "Sources" button to display a dialog containing
the list of sources. At first, the list will be empty. Click the plus (+) button
to add a new source to the list, then select it and enter "spacenews.rss". Then
click the "OK" button to close the dialog.
The next step is to specify the format for displaying the content. RSS Replay comes with 10 formats for displaying content (and you can create your own too). You'll just select one from existing formats in the "Format" menu. Right now the menu indicates that there are "No Settings". Select "Headlines w Stories", which will display the headline and the story associated with that headline.
Now that you've specified that you'll want to see what the page will look like.
RSS Replay provides an in-Dreamweaver preview of the content so that you can
better assess how the content fits into your page and make adjustments as needed.
To play the Replay press the "Play" button in the inspector.
Now your page will change to display the RSS content in the layout and the
"Play" button will change to say "Stop" -- press this when you are done previewing.
You can try other formats too -- for example: "Headlines w Stories (Definition
List)". Change the format to that and now your layout will have hanging indents
(standard definition list formatting).
OK, that looks pretty good, but say you wanted to make those headlines a little
bigger than the other content. You can do that with CSS. Create a CSS class
and call it "replayheads" and set the font size to be "larger" and set the weight
to be "bold".
Now apply that style to the headlines by selecting it from the "Headln Class"
Preview the Replay again (press the "Play" button) and you should now see that
the headlines are larger.
Now if you're really paying attention to details in the layout, you'll see
there's a blank line above our feed content that appears to be part of the preview
selection. What's happening here is that RSS Replay is inserting content where
it is placed in the layout. By default, Dreamweaver puts any content into paragraphs
(P tags). So what we have is an extra P tag wrapping our Replayed content. It's
easy to fix this -- switch off the preview, so you are looking at the little
icon in the layout. The icon should still be selected, and the Tag Insepector
(the status area at the bottom of the Dreamweaver window) shows which tags are
wrapping the current content. Right now it says "<body><p>". Right
click (or control click for you Mac folks) on the P tag there and select "Remove
Tag" from the contextual menu.
If you preview again (press the "Play" button) you'll now see that the extra
space is gone.
Perfecto! So now you'll want to take a look at the page in the web browser.
Save the page and open it in your favorite web browser.
Doh! Until you register RSS Replay the content in the browser will only show
and you'll see the same thing in the browser that you do in Dreamweaver.
Replaying a Remote Feed
There are really only two important differences between a local feed and a remote feed. First, you have to change the source so the URL is a full URL that includes the protocol (e.g. http://www.whatever.com/path/file.rss). Second, you have to change the method being used to include a proxy that will make the request for RSS content for you (RSS Replay offers two methods -- ASP & PHP).
Start by opening "nasaarticles.html". You're going to replay the feed from
NASA news page so that your readers can see the headlines, and maybe a little
bit of the stories.
Select the text that says "Put Replay Here", delete it and insert a Replay.
Now to configure the replay, begin with the source. Click the "Sources" button
in the inspector. Press the plus button and then enter the URL for the feed:
Then select the format to display this feed with. Choose "Headlines w Stories
(25 Word Stories w UL)". This will display the headlines and stories as a bulleted
list, and trim the stories to only the first 25 words.
Finally, we're going to specify the method for transferring the feed using
This method is restricted to displaying feeds that are from the same domain
as the page -- a restriction based on the way the web browsers handle data requests.
To get around that limitation RSS Replay uses a proxy to request the RSS feed
from a remote server but to provide the data as if it were from the local domain.
The proxy is a server script and has been included in both ASP and PHP -- so
all you have to do is pick the server language that you are using. Of course,
you will not be able to test this method without having a server to put in on.
Select the proxy that is appropriate for your server.
Now if you press the "Play" button you will see the layout including content
from a remote source. Don't worry if you see an HTTP error -- sometimes Dreamweaver
times-out before the data is completely transferred -- pressing "Stop" and then
"Play" again usually solves this problem.
So save this and test it on your server.
Of course, if you haven't registered yet you'll still see "RSS Replay is Unregistered".
unlocked versions and your page will work perfectly.
Lastly, I want to leave you with one more idea. You can customize your display
not only with CSS but also by changing the HTML that is being generated by RSS
Replay. In the "Format" menu of the property inspector you will also find the
"Advanced" option. Selecting that option will present you with a dialog where
you can enter the HTML codes that will be used along with special Replay tags
that are used to identify where content is placed and what to do with it --
like<<headline>> and <<story>>. I'll leave that for
you to play with. More about the Replay tags can be found in the help file at