custom RSS details in Gatsby


My gatsby-config file followed the basic pattern present in most/all of the starter examples. It exported basic siteMetadata as follows:

module.exports = {
  siteMetadata: {
    title: 'Pine and Vine',
    description: "It's some kind of a web thing.",
    siteUrl: 'https://www.pineandvine.com',
  },
  ...
}

However, I wanted my blog-feed to have a different name from the pineandvine.com domain. I had already arranged to have gatsby-paginate paginate posts on a route other than /index (see). So I tweaked my siteMetadata to read:

module.exports = {
  siteMetadata: {
    title: 'Pine and Vine',
    description: "It's some kind of a web thing.",
    siteUrl: 'https://www.pineandvine.com',
    rss: {
      title: 'Rich Text',
      description: 'On coding, podcasts, and dog photos',
    },
  },
  ...
}

No matter how I fiddled with the graphQL queries, I couldn’t figure out how to get gatsby-plugin-feed (g-p-f) to use the rss description and title fields. I had to look a little deeper into how g-p-f uses the underlying `node-rss` module, to override its default behavior.

The Gatsby docs on g-p-f show an `options` object in its config. That object contains a graphQL query that looks like this:

query: `
        {
          site {
            siteMetadata {
              title
              description
              siteUrl
              site_url: siteUrl
            }
          }
        }
      `,

I was adding rss { title description } underneath site_url in that query, and trying to somehow use the .rss reference in the resulting feed serialize function, but knew that didn’t really make sense. It wasn’t clear to me how the title and description under siteMetadata were getting to the final XML file.

That’s when I opened up the /src/internals.js in g-p-f. The internals include another object in the plugin’s options, a setup function. By default it reads:

  setup: ({ query: { site: { siteMetadata }, ...rest } }) => {
    return {
      ...siteMetadata,
      ...rest,
    }
  },

Ah! The return from this setup function is passed into node-rss to create a new XML file (see ln 46-51 here)… and I didn’t want to simply spread site.siteMetadata’s properties into that file; I wanted the title and description to be overridden by the info in site.siteMetadata.RSS to go in, instead.

In between the query and the array of feeds, I added this to the g-p-f’s options object:

        setup: ({ query: { site: { siteMetadata } } }) => {
          return {
            siteUrl: siteMetadata.site_url,
            site_url: siteMetadata.siteUrl,
            title: siteMetadata.rss.title,
            description: siteMetadata.rss.description,
          };
        },

The data passed into node-rss is subsequently the rss.title and rss.description instead of the default title and description in siteMetadata.

As I typed this up, I re-read g-p-f’s gatsby-node file, and I’m wondering if there’s a cleverer way to do this… but what I’ve got works, for the time being.

This entry was posted on March 14, 2018 with tags

indie.mood