Create an RSS data source listing

This tutorial shows you how to create a dynamic list generated from an external RSS feed using an Asset Listing and the RSS Data Source asset.

Prerequisites

There are no prerequisites required to complete this tutorial.

To see a working solution for this tutorial, you can Download tutorial assets used in this tutorial and import them into your Matrix system using the Import Assets from XML tool.

Creating the RSS Data Source Asset

Set up the RSS Data Source asset and point it to the URL of the RSS feed.

  1. Create an RSS Data Source asset in your system and name it "Matrix News RSS Feed".

  2. Go to the Details screen and scroll down to the RSS Details section.

  3. In the Link For The Feed field, enter https://matrix.squiz.net/news/rss.xml.

  4. Click Save to set the RSS feed source.

The asset tree refreshes automatically, and you can expand the RSS Data Source asset in the tree. Below the data source asset, notice the Data Source shadow assets that are created automatically for you.

Configuring the Asset Listing

Now the RSS feed is connected and working you can list these items out on the frontend using an Asset Listing.

  1. Create an Asset Listing named "Latest Matrix News" in a location that lets you preview it on the front end.

  2. Go to the Details screen and select Data Source Record Set from the Asset Types to Lists field.

  3. Scroll down to the Root Nodes field and select the Matrix News RSS Feed RSS Data Source asset you created earlier.

You should now be able to preview your Asset Listing on the frontend and see a list of all RSS feed items available.

Customising the Listing Layout

In addition to just listing each item from the RSS Feed, you can customise the listing layout for each item to include the published date, description, and a link to the source.

All these values are available within each item in the RSS feed.

  1. Go to the Details screen of one of the Data Source Record Set assets to see a preview of what attributes and data are available.

  2. Get the keywords we need to use to replace the various values within the listing layout for each item:

    • %ds__link%

    • %ds__title%

    • %ds__pubdate%

  3. Expand the child assets of the Asset Listing.

  4. Go to the Edit Contents screen of the Page Contents Bodycopy and convert the Component to a Code component.

  5. Put the %asset_listing% keyword into an unordered list:

    <ul>
        %asset_listing%
    </ul>
  6. Go to the Edit Contents screen of the Default Format Bodycopy convert it to a Code component.

  7. Enter the Keyword Replacements for the various RSS attributes using the code example as a guide:

    <li>
        <h3><a href="%ds__link%" target="_blank">%ds__title%</a></h3>
        <p>
            <small>%ds__pubdate^date_format:j F Y%</small><br/> (1)
            %ds__description%
        </p>
    </li>
    1 The ^date_format keyword modifier changes the formatting of the raw date value produced by the RSS feed.
  8. Preview the Asset Listing again and notice how the basic formatting is enriched with dynamic values from each RSS item.

Summary

You now understand how to create a dynamic list generated from an external RSS feed using an Asset Listing and the RSS Data Source asset.

© 2015-2020 Squiz Pty Ltd