Testing Craft to Notion to Webflow

\#thisSite #webflow

I’ve been a massive fan of RSS since the Google Reader days. So, naturally, I added feeds to my site. This week, I read an excellent post by Robb explaining how difficult it was for him to find the RSS feeds on most personal websites. Even though mine have been accessible in the nav footer, I wanted to follow his tips to make them even more discoverable.

ㅤ

<aside>

⚠️ This is a callout

</aside>

Creating a Feeds Page

Before this when you you clicked on my RSS links they would automatically oppened the feed url in another tab, so you had to go to the adddres bar and copy it. I now created a dedicated Feeds page so when you click on the navigation link it opens this oage instead. Having a page allows me to explain a bit more what RSS for people who font lnow. It also allows me to show the mutiple feeds I have for different content, such as my main feed and my bookmarks/links feed

ㅤ

<a href="<https://brickset.com/sets/75339-1/Death-Star-Trash-Compactor-Diorama>" target="_blank" class="card-media-horizontal w-inline-block">
                      <div class="card-media_thumbnail-lego w-embed"><img class="card-media_thumbnail-lego" src="<https://images.brickset.com/sets/large/75339-1.jpg?202201040354>"></div>
                      <div class="card-media_content-container">
                        <div class="card-media_content">
                          <div class="card-media_content-title">Death Star Trash Compactor Diorama</div>
                          <div class="card-media_content-metadata">
                            <div class="card-media_content-metadata-group">
                              <div class="card-media_content-metadata-text">75339</div>
                              <div class="divider_text-bullet hide-mobile-portrait">·</div>
                              <div class="card-media_content-metadata-text">2022</div>
                            </div>
                            <div class="divider_text-bullet hide-mobile-portrait">·</div>
                            <div class="card-media_content-metadata-text w-embed">Star Wars / Diorama Collection</div>
                          </div>
                        </div>
                        <div class="div-block-3">
                          <div class="text-link small hide-mobile-portrait">
                            <div>View on bricklink</div>
                          </div>
                        </div>
                      </div>
                    </a>

Cory Dransfeldt's website heavily inspired the content of the page.

Exposing feeds in Webflow

I use Webflow to build my website and it was very easy to expose the feeds. In the custom code section I went to the head code and pasted in the snippets that Robb mentioned in his article. I made sure to add both my RSS feeds URLs.

Using a shortcut to find feeds quicker

Because I face a similar problem to Robb where I struggle to find other people RSS feeds buttons I use a shortcut to help me. Federico Vittici from Mac Stories created a shortcut that scrapes the site for its RSS feeds urls and adds them to your clipboard so you can easily paste them into your RSS reader of choice.

But the shortcut does not work unless they have oroperly exposed their feeds like Rob explains. I noticed that the shortcut was not even working on my site, but after I exposed the feeds on my page's header I was able to get it working.

I have modified the shortcut a bit. You can download the shortcut here if you are interested.

These are web feeds, also known as RSS or Atom feeds. Subscribe by copying the URL from the address bar into your newsreader. Visit About Feeds to get started with newsreaders and subscribing. It's free.

Thanks to Rob post I was able to expose both my RSSfeeds, and also got to create a dedicated Feeds page 🙌🏼

Rss Feeds

Making RSS feeds more discoverable on my website. Long live RSS!