Head metadata

Customizing head metadata

Docusaurus automatically sets useful page metadata in <html>, <head> and <body> for you. It is possible to add extra metadata (or override existing ones) with the <head> tag in Markdown files:

markdown-features-head-metadata.mdx

---id: head-metadatatitle: Head Metadata---<head>  <html className="some-extra-html-class" />  <body className="other-extra-body-class" />  <title>Head Metadata customized title!</title>  <meta charSet="utf-8" />  <meta name="twitter:card" content="summary" />  <link rel="canonical" href="https://docusaurus.io/docs/markdown-features/head-metadata" /></head># Head MetadataMy text

mdx-code-block

<head>
  <html className="some-extra-html-class" />
  <body className="other-extra-body-class" />
  <title>Head Metadata customized title!</title>
  <meta charSet="utf-8" />
  <meta name="twitter:card" content="summary" />
  <link rel="canonical" href="https://docusaurus.io/docs/markdown-features/head-metadata" />
</head>

This <head> declaration has been added to the current Markdown doc as a demo. Open your browser DevTools and check how this page's metadata has been affected.

Markdown page description

The Markdown pages' description metadata may be used in more places than the head metadata. For example, the docs plugin's generated category index uses the description metadata for the doc cards.

By default, the description is the first content-ful line, with some efforts to convert it to plain text. For example, the following file...

Markdown

# Title

Main content... May contain some [links](./file.mdx) or **emphasis**.

...will have the default description "Main content... May contain some links or emphasis". However, it's not designed to be fully functional. Where it fails to produce reasonable descriptions, you can explicitly provide one through front matter:

Markdown

---
description: This description will override the default.
---

# Title

Main content... May contain some [links](./file.mdx) or **emphasis**.