Search code examples
reactjstags

set dynamic meta tags in reactjs when js is disabled


I'm getting some problems with google crawlers and meta tags, I'm using reactjs with react-helmet (no ssr). React-helmet does work but google search does not seem to find the tags I added. I know that crawlers do run the website without js enabled, when testing this I can see that react-helmet does not render the tags when js is disabled (works fine when it is enabled).

The fact that react-helmet does not render tags when js is disabled might be the reason why the description and titles are wrong in google search. maybe that finding a way to renders the proper tags when js is disabled might fix the problem.

Any idea on how to do that?

thanks for the help.


Solution

  • You have two options if you want to make your React pages discoverable on search engines: server-side rendering (SSR) or prerendering.

    Server Side Rendering:

    React can render pages on the server-side, making it easier for search engine crawlers to discover and index your content. However, it requires a more advanced setup using a library like Next.JS along with additional time-consuming and expensive server.

    Prerendering

    Meanwhile, using Prerender is painless and straightforward. Their software will seamlessly create fully-rendered, static HTML versions of your website for social media, search engine crawlers and more. However, you have to install the Prerender.io middleware on your server.