I’ve found this: https://www.sanity.io/plugins/sanity-plugin-seo-tools So far i’m installing and testing. But how does this work with React? Pointers as to using Sanity...

14 replies

Last updated: Sep 30, 2020

Hi, can someone give me some pointers as to using Sanity to edit SEO meta title, description etc for React pages?

Sep 30, 2020, 9:40 AM

Plain React? or Gatsby/Next?

Sep 30, 2020, 9:58 AM

Plain React

Sep 30, 2020, 9:58 AM

I assume you already have a SEO schema in Sanity

Sep 30, 2020, 9:59 AM

I’ve found this:
https://www.sanity.io/plugins/sanity-plugin-seo-tools
So far i’m installing and testing.
But how does this work with React?

Sep 30, 2020, 9:59 AM

I’ve never used this one

Sep 30, 2020, 9:59 AM

You need something like this for React https://www.npmjs.com/package/react-helmet

Sep 30, 2020, 10:00 AM

and you simply map your data from Sanity

Sep 30, 2020, 10:00 AM

ok thanks

Sep 30, 2020, 10:01 AM

🙂

Sep 30, 2020, 10:01 AM

my SEO component looks like this

Sep 30, 2020, 10:01 AM

Dude, awesome!Thanks a lot
🙂

Sep 30, 2020, 10:02 AM

The data is coming from this graphQL query

 query IndexPageQuery {
    site: sanitySite {
      title
      description
      url
      keywords
      image {
        asset {
          _id
        }
      }
    }

Sep 30, 2020, 10:04 AM

Excellent, i was just about to ask

Sep 30, 2020, 10:08 AM

😄

Sep 30, 2020, 10:08 AM

Sanity.io: Get the most out of your content

Sanity.io is a platform to build websites and applications. It comes with great APIs that let you treat content like data. Give your team exactly what they need to edit and publish their content with the customizable Sanity Studio. Get real-time collaboration out of the box. Sanity.io comes with a hosted datastore for JSON documents, query languages like GROQ and GraphQL, CDNs, on-demand asset transformations, presentation agnostic rich text, plugins, and much more.

Don't compromise on developer experience. Join thousands of developers and trusted companies and power your content with Sanity.io. Free to get started, pay-as-you-go on all plans.