Categories
React Answers

How to add react meta description with i18n-next React?

Spread the love

To add react meta description with i18n-next React, we can use the useIntl hook with React Helmet.

We install React Helmet with

npm i react-helmet

Then we use the useIntl hook to get the formatMessage function.

And then we add the meta tag into the Helmet component provided by React Helmet.

Then we set the content prop to a string returned by the f function to get the translated string by the id property.

import { useIntl } from 'react-intl';

const DescriptionMeta = () => {
  const { formatMessage: f } = useIntl();

  return (
    <Helmet>
      <meta name="description" content={f({ id: 'meta.description' })} />
    </Helmet>
  );
};

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.