CraftCMS doesn’t appear to have a built-in way to display RSS feeds and more often than not, clients want to display their recent or related blog posts on their main website.
The first thing we did to tackle this challenge was install the Craft RSS plugin by Guilty AS.
The GitHub page for the plugin has an example of how to display the RSS feed in your templates and it’s pretty straight forward.
{% set blogFeed = craft.rss.loadRss(“https://helgesverre.com/blog/feed") %}
{% if blogFeed %}
<h1>{{ blogFeed.title }}</h1>
<a href=”{{ blogFeed.link }}”>{{ blogFeed.link }}</a>
<ul>
{% for post in blogFeed.item %}
<li><a href=”{{ post.link }}”>{{ post.title }} — {{ post.pubDate }}</a></li>
{% endfor %}
</ul>
{% endif %}
Just plug in your RSS Feed URL and off you go.
Naturally you’ll want to arrange the results of the feed in a way that best matches your site’s design.
You are might want to limit the number of posts you are showing. To do that we set a counter = 0 at the beginning of the block (line 2 below). Then before each “for post in blogFeed.item” loop we check if the counter is less than the number of posts we want to show (line 9). Right before the end of the loop then increment the counter with a +1 (line 17).
{% set blogFeed = craft.rss.loadRss(block.linkUrl) %}
{% set counter = 0 %}
{% if blogFeed %}
<h1>{{ blogFeed.title }}</h1>
<a href=”{{ blogFeed.link }}”>{{ blogFeed.link }}</a>
<ul>
{% if counter < 3 %}
{% for post in blogFeed.item %}
<li>
<a href=”{{ post.link }}”>{{ post.title }} — {{ post.pubDate }}</a><br/>
<span>{{ post.description | raw }}</span>
</li>
{% set counter = counter + 1 %}
{% endfor %}
{% endif %}
</ul>
{% endif %}
If you want to make this a little more flexible you could create a field in Craft to take in the URL of the blog feed, either per entry or as a global.
If you really want to get fancy you could create several different type of display options (card, list, etc) and let the user choose how they want to display the information.
ETA: I recently came back across this article while adding a feed to a client’s site. Turns out the code was a little incorrect and very annoying to not be able to copy and paste so I’m fixing those issues. You may also have to look at your feed directly to figure out what things you can pull in, in this example we had to pull in the full description as raw text rather than html in order to get the image and excerpt.
Top comments (0)