Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Andy Carmona
Andy Carmona

Posted on

     

Implementing RSS feed in Jigsaw

This post was originally published onmy personal blog

Really Simple Syndication or RSS for short is a protocol that provides a method for aggregating web content. It is also a standard that defines the structure of a file (XML) for content publishing. The XML should conform to the WC3's RDF specificationhttps://www.w3.org/wiki/RSS.

It is used by other sites and tools (called feed aggregators or feed readers), to subscribe to your blog or website and get the content as soon as it is available.

How Does RSS Work?

It is pretty simple:

  • A website creates one or more RSS feeds and keep it (them) in a server.
  • A user subscribes to your feed using afeed reader, this could be another site likeFeedly, ora desktop app likeThunderbird.
  • The feed reader shows the user the content of your site.

And that's it!.

Implementing RSS in Jigsaw

This is really straight forward, as it is notice in the Jigsaw documentation.

Other non-HTML, text-type files can also be processed with the Blade engine first, allowing you to dynamically generate non-HTML files that include variables and Blade control structures. Supported file extensions include .blade.js, .blade.json, .blade.xml, .blade.rss, .blade.txt, and .blade.text [...] The output file will maintain its filetype extension in the resulting URL; for example, a file named some-file.blade.xml will be processed by Blade, then will be accessible at the URL my-jigsaw-site.com/some-file.xml.

So, all you need to do is add a file with a.blade.xml extension to yoursource directory, for examplerss.blade.xml with the following content:

{!!'<'.'?'.'xml version="1.0" encoding="UTF-8" ?>'!!}<rssversion="2.0"xmlns:atom="http://www.w3.org/2005/Atom"xmlns:content="http://purl.org/rss/1.0/modules/content/"xmlns:media="http://search.yahoo.com/mrss/"><channel><title>{{$page->siteName}}</title><link>{{$page->baseUrl}}</link><description><![CDATA[{{$page->siteDescription}}]]></description><atom:linkhref="{{$page->getUrl() }}"rel="self"type="application/rss+xml"/><language>{{$page->siteLanguage}}</language><lastBuildDate>{{$posts->first()->getDate()->format(DateTime::RSS)}}</lastBuildDate>@foreach($postsas$post)<item><title><![CDATA[{!!$post->title!!}]]></title><link>{{$post->getUrl()}}</link><guidisPermaLink="true">{{$post->getUrl()}}</guid><description><![CDATA[{!!$post->description!!}]]></description><content:encoded><![CDATA[{!!$post->getContent()!!}]]></content:encoded><dc:creatorxmlns:dc="http://purl.org/dc/elements/1.1/">{{$post->author}}</dc:creator><pubDate>{{$post->getDate()->format(DateTime::RSS)}}</pubDate>@if($post->cover_image)<media:contentmedium="image"url="{{$page->baseUrl .$post->cover_image }}"type="image/jpeg"width="150"height="150"/>@endif</item>@endforeach</channel></rss>
Enter fullscreen modeExit fullscreen mode

Then build your site withnpm run local,npm run staging, ornpm run production. Once your site is build, a file named, in this caserss.xml will be placed in the root of your site. All that's left to do is to add a<link rel="alternate" /> to the head of your master layout file like so:

<linkrel="alternate"type="application/rss+xml"title="{{ $page->siteName }}"href="{{ $page->baseUrl.'/rss.xml' }}"/>
Enter fullscreen modeExit fullscreen mode

Testing your RSS feed.

Once you have generated your RSS file, you can test it adding it to your feed reader/aggregator of choice. Let's try withFeedly:

  1. Open Feedly.
  2. Select theFollow new sources button on the left toolbar.

    Follow source

  3. Enter your site's URL, Feedly will automatically detect your site's feed and show you.

  4. Select your source.

  5. Click the follow button and voila!, your feed is ready to be consumed by your users.

    Your feed!

Top comments(0)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

Full Stack Web Developer #laravel, #javascript, #vuejs, Blockchain enthusiast, programming nerd, geek & computer lover.
  • Location
    Cuernavaca, mor.
  • Work
    Fullstack web developer & ninja
  • Joined

More fromAndy Carmona

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp