This is important not just for site viewers, but also for SEO -- title and description metadata stored in the document head is a key component used by Google in determining placement in search results.

Why no react-helmet?

Size comparison:

Package	Size
`react-helmet`
`react-head`

React Helmet is great and has more features than React Head, but sometimes you want less than more.

Install

npm i gatsby-plugin-react-head react-head

yarn add gatsby-plugin-react-head react-head

How to use

Add the plugin to the plugins array in your gatsby-config.js

plugins: [`gatsby-plugin-react-head`];

You don't have to do anything else. Render one of head tag components whenever you want to inject a tag in the <head />.

import React from "react";
import { Title, Link, Meta } from "react-head";

const Seo = () => (
  <>
    <Title>Hello world!</Title>
    <Meta name="description" content="Lorem ipsum dolor sit amet." />
    <Link rel="canonical" content="https://bejamas.io/" />
  </>
);

Keywords

FAQs

What is gatsby-plugin-react-head?

Is gatsby-plugin-react-head popular?

Is gatsby-plugin-react-head well maintained?

Package last updated on 27 Jul 2019

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install