Blaugust 2022 – Creating an RSS Feed for an HTML Blog or Website

Posted on August 8, 2022 by Aywren

Another thing that I missed from my WordPress.com blog when I moved to a static HTML blog was the generation of an RSS feed. I’ve been using feed readers for years to keep up with blogs and websites I enjoy, so there’s no way that I’m running a blog that doesn’t have an RSS feed attached to it.

However, when you're a webmaster for a static HTML site, changes to your site do not automatically create a feed like WordPress does. So you have to handcode your own!

This was not anywhere near as difficult as I thought it would be, thanks to this webpage resource that got me started learning about the topic.

I do a few things differently from the instructions on this page, however. First, I save my feed file as an .xml instead of a .txt file. I’m not sure if that matters or not, but most feed files I’ve seen were .xml.

Second, I wanted to add pictures to my RSS feed because I feel that’s important to draw the reader’s eye in a feed. So I did some extra research and discovered how to make code that supported images as well as text.

Here’s the basic code that I use for my RSS template!

<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>Title of Your Site</title>
<description>Short Description of Your Site</description> 
<link>Full URL to Your Site</link>
<lastBuildDate>
Tue, 28 Jun 2022 01:36:49 -0500
</lastBuildDate>
<ttl>20000</ttl>

<item>
<title>Blog Post or Page Title</title>
<description>
<![CDATA[
<br/><img src='full-url-of-image-source.jpg' ><br/>
Excerpt of your post – usually the first paragraph or two. <p>
]]>
</description>
<link>https://full-URL-of-post-or-page.html </link>
<pubDate>
Tue, 28 Jun 2022 01:36:49 -0500
</pubDate>
</item>

</channel>
</rss>

So looking at this code, you have a header section at the top:

<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0">
<channel>
<title>Title of Your Site</title>
<description>Short Description of Your Site</description> 
<link>Full URL to Your Site</link>
<lastBuildDate>
Tue, 28 Jun 2022 01:36:49 -0500
</lastBuildDate>
<ttl>20000</ttl>

And a footer section at the bottom:

</channel>
</rss>

These must always remain in place. Of course, you replace the information in the header with your own site’s information. But aside from that, don’t change the coding.

For each post or page you want to add to the feed, you add a new <item> section and replace it with your post/page information.

<item>
<title>Blog Post or Page Title</title>
<description>
<![CDATA[
<br/><img src='full-url-of-image-source.jpg' ><br/>
Excerpt of your post – usually the first paragraph or two. <p>
]]>
</description>
<link>https://full-URL-of-post-or-page.html </link>
<pubDate>
Tue, 28 Jun 2022 01:36:49 -0500
</pubDate>
</item>

It’s important to know that you MUST use full URLs for the image and the post/page link!

When you add a new item to the feed, you can just add a new <item> section above the old one and leave the previous one unchanged. This provides a running history of items in your feed. To see an example of this, check out my own RSS feed – you’ll see a list of posts past and present!

And finally, it’s important to make sure you have the proper date and time in two places:

  • Update the <lastBuildDate> in the RSS header each time
  • The <pubDate> in your new <item>

These will usually be the same date/time. Don't change the date and time of old post entries, of course. The page I learned from suggested using the Time Stamp Generator to create these, and that is what I have been using without fail.

You just take all this content, put it into a text file editor (such as Notepad), make your edits and save it as feed.xml. Upload this file to your webhost, make a link to it on your site somewhere so people can discover and use it, and remember to update it every time you create a post or page that you want folks to be informed of.

There you go – you now have a hand-coded RSS feed!

Comments