Skip to content Skip to footer navigation

Making a Podcast Website in Statamic

by Jay George

Making a podcast website is the same as a regular website when you break it down—the big difference is you need to output what's essentially an RSS feed. In this video, we'll build a podcast website in Statamic complete with an Apple podcast feed from scratch.

Most of the video will cover spinning up a site and setting up blueprints. For the written article, here are the things you need to output for the RSS feed, which you'll need to give your podcast host.

1. Output a Link to a Podcast RSS Feed in Your <Head>

Add this to your head.antlers.html:

{{# RSS
=================================================== #}}
<link rel="alternate" type="application/rss+xml" title="Name of your podcast feed" href="{{ current_url }}/rss">

2. Create an RSS Template

Create a new file at resources/views/rss.antlers.html. Here is my specific implementation:

{{ xml_header }}

<rss xmlns:itunes="http://www.itunes.com/dtds/podcast-1.0.dtd" version="2.0">
    <channel>
        <title>{{ brand:name | cdata }}</title>
        <itunes:title>{{ brand:name | cdata }}</itunes:title>
        <link>{{ config:app:url }}</link>
        <language>en-us</language>
        <copyright>{{ brand:authors | cdata }}</copyright>
        <itunes:author>{{ brand:authors | cdata }}</itunes:author>
        <itunes:summary>{{ brand:podcast_description | cdata }}</itunes:summary>
        {{# This should hold a concise, one-sentence description of your podcast. #}}
        <itunes:subtitle>{{ brand:podcast_subtitle | cdata }}</itunes:subtitle>
        <itunes:explicit>yes</itunes:explicit>
        <description>{{ brand:podcast_description | cdata }}</description>
        <itunes:owner>
            <itunes:name>{{ brand:podcast_owner | cdata }}</itunes:name>
            <itunes:email>{{ brand:podcast_email | cdata }}</itunes:email>
        </itunes:owner>
        <itunes:image href="{{ config:app:url }}{{ glide:brand:podcast_artwork square='1400' }}" />
        <itunes:keywords>Games</itunes:keywords>
        {{# https://www.podcastinsights.com/itunes-podcast-categories/ #}}
        <itunes:category text="Leisure">
            <itunes:category text="Video Games" />
        </itunes:category>
        <itunes:category text="News">
            <itunes:category text="Tech News" />
        </itunes:category>
        <itunes:category text="Technology"/>

        {{# PODCAST
        =================================================== #}}
        {{ collection:episodes as='posts' sort='date:desc' }}
            {{ partial:rss-post }}
        {{ /collection:episodes }}
    </channel>
</rss>

In the above we're linking to an item partial, which looks like this:

{{ posts }}
    <item>
        <title>Ep.{{ episode_number | cdata }} {{ title | cdata }}</title>
        <link>{{ config:app:url }}/episodes/{{ episode_number }}-{{ slug }}</link>
        <itunes:author>{{ brand:authors | cdata }}</itunes:author>
        <itunes:explicit>yes</itunes:explicit>
        <itunes:subtitle>{{ content | smartypants | striptags | cdata }}</itunes:subtitle>
        <itunes:summary>{{ content | smartypants | striptags | cdata }}</itunes:summary>
        {{# the Description tag is requested by some hosts e.g. https://podcasters.radiopublic.com/dashboard #}}
        <description>{{ content | smartypants | striptags | cdata }}</description>
        <itunes:image href="{{ config:app:url }}{{ if artwork }}{{ glide:artwork square='1400' }}{{ else }}{{ glide:brand:podcast_artwork square='1400' }}{{ /if }}" />
        <enclosure url="{{ audio }}" length="{{ size }}" type="audio/mpeg" />
        <guid>{{ episode_number }}</guid>
        <pubDate>{{ date format='D, d M Y H:i:s O' }}</pubDate>
        <itunes:duration>{{ duration }}</itunes:duration>
    </item>
{{ /posts }}

3. Create a Route

We need to define a route which removes the layout template and processes. Open routes/web.php and add the following: Route::statamic('/rss', 'rss', ['layout' => '', 'content_type' => 'xml']);

What we're saying here is—When these routes are matched, use our 'rss' Antler's template, skip layout processing (you'll notice we have a blank layout argument), then render the content as 'xml'—which is needed for podcast feeds.

4. Validate Your Podcast Feed

Podcast aggregators are fussy about how they receive content so it's best to be thorough. My favourites are Cast Feed Validator and Podbase

Categories

Tags

Subscribe