RSS Feed in a 11ty site
Tags: 11ty, rss, xml
Published: 2022-07-14 19:17:42

---
title: RSS Feed in a 11ty site
published: true
date: 2022-07-14 15:00:00 UTC
tags: #11ty #rss #xml
canonical_url: https://conormeagher.com/posts/2022/07/rss-for-11ty/
---

![RSS Logo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kzpbah0eh31xl2gafpq8.png)

https://twitter.com/conrmahr/status/1479151678637187079(https://twitter.com/davatron5000/status/1308404187299012616?s=20&t=e4vdBOpt8sEjbCJp21Qz7A)

[Dave Rupert](https://daverupert.com/) is right. Really Simple Syndication or [RSS](https://en.wikipedia.org/wiki/RSS) is a great way for people to digest their favorite blog articles with a RSS reader of their choice not be bombarded with ads, click-bait, and spam. So why not do your readers a favor and add it to your 11ty blog?

### Install package [#](https://conormeagher.com/posts/2022/07/rss-for-11ty/#install-package "Anchor link for easy sharing.")

Start in your 11ty project folder and install this package.

```
npm install @11ty/eleventy-plugin-rss --save-dev
```

### Include in your 11ty configuration [#](https://conormeagher.com/posts/2022/07/rss-for-11ty/#include-in-your-11ty-configuration "Anchor link for easy sharing.")

In the `.eleventy.js` file, require the plugin and include it in the `module.exports` function with any other plugins you may have.

```
const pluginRss = require("@11ty/eleventy-plugin-rss");
  module.exports = function(eleventyConfig) { eleventyConfig.addPlugin(pluginRss);
};
```

### Add to feed metadata [#](https://conormeagher.com/posts/2022/07/rss-for-11ty/#add-to-feed-metadata "Anchor link for easy sharing.")

In the `_data/metadata.json` file, add the unique metadata for the feed.

```
{
  "feed": {
     "subtitle": "Tech posts to educate, elevate, but mostly entertain.",
     "filename": "feed.xml",
     "path": "/feed/feed.xml", 
     "url": "https://conormeagher.com/feed/feed.xml",
     "id": "https://conormeagher.com/"
  },
},
```

### Create a RSS feed [#](https://conormeagher.com/posts/2022/07/rss-for-11ty/#create-a-rss-feed "Anchor link for easy sharing.")

From your top-level of your 11ty project folder, create this template file.

```
touch src/feed.xml
```

Atom has several advantages over RSS: less restrictive licensing, IANA-registered MIME type, XML namespace, URI support, RELAX NG support. <sup><a href="https://conormeagher.com/posts/2022/07/rss-for-11ty/#fn1" id="fnref1">[1]</a></sup> Knowing this, we will copy and paste the Atom format to produce our feed template. Other formats are available such as RSS and JSON. <sup><a href="https://conormeagher.com/posts/2022/07/rss-for-11ty/#fn2" id="fnref2">[2]</a></sup>

```
---
# Metadata comes from _data/metadata.jsonpermalink: "{{ metadata.feed.path }}"eleventyExcludeFromCollections: true
---
<?xml version="1.0" encoding="utf-8"?><feed xmlns="http://www.w3.org/2005/Atom">
<title>{{ metadata.title }}</title>
<subtitle>{{ metadata.feed.subtitle }}</subtitle>
<link href="{{ metadata.feed.url }}" rel="self"/> <link href="{{ metadata.url }}"/>
<updated>{{ collections.posts | getNewestCollectionItemDate | dateToRfc3339 }}</updated>
<id>{{ metadata.url }}</id>
<author>
  <name>{{ metadata.author.name }}</name>
  <email>{{ metadata.author.email }}</email>
</author>
{%- for post in collections.posts | reverse %}
{% set absolutePostUrl %}{{ post.url | url | absoluteUrl(metadata.url) }}{% endset %}
<entry>
  <title>{{ post.data.title }}</title>
  <link href="{{ absolutePostUrl }}"/>
  <updated>{{ post.date | dateToRfc3339 }}</updated>
  <id>{{ absolutePostUrl }}</id>
  <content type="html">{{ post.templateContent | htmlToAbsoluteUrls(absolutePostUrl) }}</content>
</entry>
{%- endfor %}
</feed>
```

**Important:** This code assumes you save your date frontmatter in UTC format, not your local timezone.

```
---
date: 2022-01-01T00:00:00Z
---
```

That's it. You now have a Atom v1.0 feed on your 11ty website when you serve or build the project.

Check out mine and subscribe!  
[https://conormeagher.com/feed/](https://conormeagher.com/feed/)

<section>
<ol>
<li id="fn1">
<p><a href="https://en.wikipedia.org/wiki/RSS#RSS_compared_with_Atom" target="_blank" rel="noreferrer">"RSS compared with Atom"</a>. Retrieved June 14, 2022 <a href="https://conormeagher.com/posts/2022/07/rss-for-11ty/#fnref1">↩︎</a></p>
</li>
<li id="fn2">
<p><a href="https://www.11ty.dev/docs/plugins/rss/#sample-feed-templates" target="_blank" rel="noreferrer">"Sample Feed Templates"</a>. Retrieved July 12, 2022 <a href="https://conormeagher.com/posts/2022/07/rss-for-11ty/#fnref2">↩︎</a></p>
</li>
</ol>
</section>