--- id: head-metadatas title: Head Metadatas description: Declaring page-specific head metadatas through MDX slug: /markdown-features/head-metadatas --- # Head Metadatas Docusaurus automatically sets useful page metadatas in `<html>`, `<head>` and `<body>` for you. It is possible to add extra metadatas (or override existing ones) by using the `<head>` tag in Markdown files: ```md title="markdown-features-head-metadatas.mdx" --- id: head-metadatas title: Head Metadatas --- <!-- highlight-start --> <head> <html className="some-extra-html-class" /> <body className="other-extra-body-class" /> <title>Head Metadatas customized title!</title> <meta charSet="utf-8" /> <meta name="twitter:card" content="summary" /> <link rel="canonical" href="https://docusaurus.io/docs/markdown-features/head-metadatas" /> </head> <!-- highlight-end --> # Head Metadatas My text ``` ```mdx-code-block <head> <html className="some-extra-html-class" /> <body className="other-extra-body-class" /> <title>Head Metadatas customized title!</title> <meta charSet="utf-8" /> <meta name="twitter:card" content="summary" /> <link rel="canonical" href="https://docusaurus.io/docs/markdown-features/head-metadatas" /> </head> ``` :::tip This `<head>` declaration has been added to the current Markdown doc, as a demo. Open your browser DevTools and check how this page's metadatas have been affected. ::: :::note This feature is built on top of the Docusaurus [`<Head>`](./../../docusaurus-core.md#head) component. Refer to [react-helmet](https://github.com/nfl/react-helmet) for exhaustive documentation. :::