Support Overrides in gatsby-plugin-canonical-urls

[hs737]

Summary

I would like to introduce an overrides option in gatsby-plugin-canonical-urls. This plugin is really useful for adding the canonical tag across all the pages created in Gatsby. But it has an all-or-nothing approach about it. If I want just one page to reference another page, then I need to remove this plugin and manually add a canonical URL to every page.

My proposal for an overrides tag will make this easier. I am not attached to the label overrides, if there is a better term for this (perhaps originalReferences?). Also, I am happy to enter a PR myself, although I have not contributed to this repo before, so I could use a little guidance.

Basic example

Currently the plugin, gatsby-plugin-canonical-urls, supports two options: siteUrl and stripQueryString

module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-canonical-urls`,
      options: {
        siteUrl: `https://www.example.com`,
        stripQueryString: true,
      },
    },
  ],
}

I would like to see a third option that is overrides. This would then look like the following:

module.exports = {
  plugins: [
    {
      resolve: `gatsby-plugin-canonical-urls`,
      options: {
        siteUrl: `https://www.example.com`,
        stripQueryString: true,
        overrides: {
            "someSpecificUrl": "/",
            "someOtherPath/withSpecificUrl": "/page-2"
        }
      },
    },
  ],
}

All URLs not specified in this overrides object will operate using the existing logic.

Motivation

The hope is to make this plugin more flexible and therefore more sticky. I am currently using this plugin, and now that I have one page with some duplicate content, I need to remove this plugin and add react-helmet to every one of my pages.

I did a bit of research and I couldn't find anything, but let me know if there is already an existing, better alternative. I'm happy to hear feedback.

[herecydev]

Could you use react-helmet to override the canonical url for those pages? Or does it duplicate it? What's the use case for needing overrides?

[seniorquico]

Just tried this suggestion... I added a canonical link prop to my SEO component, and I pass that through to react-helmet. Unfortunately, this results in having two canonical link tags in the header. One generated by gatsby-plugin-canonical-urls and the other generated by react-helmet. I agree, this would be a great feature enhancement. I have a couple of edge case pages for which I'd like to override the canonical link. Otherwise, the defaults provided by gatsby-plugin-canonical-urls are perfect.

[github-actions[bot]]

Hiya!

This issue has gone quiet. Spooky quiet. 👻

We get a lot of issues, so we currently close issues after 60 days of inactivity. It’s been at least 20 days since the last update here.
If we missed this issue or if you want to keep it open, please reply here.
As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!

Thanks for being a part of the Gatsby community! 💪💜

[CEM-Christian]

Bumping this discussion as I currently have the same issue. We have a few landing pages that we wish to have the canonical URL as the homepage of our website, not the url of the landing page itself.

[CEM-Christian]

I've created pull request #38872 which adds an option excludes, allowing users to add a list of page paths to exclude from receiving a canonical url.