--- title: Seo description: >- The `` component renders SEO meta tags in the document `head`. Add the `` to your `root.jsx` before the `` and `` components. SEO metadata is set on a per-route basis using Remix [loader functions](https://remix.run/docs/en/v1/guides/data-loading). Learn more about [how SEO works in Hydrogen](https://shopify.dev/docs/custom-storefronts/hydrogen/seo). api_version: 2023-10 api_name: hydrogen source_url: html: 'https://shopify.dev/docs/api/hydrogen/2023-10/components/seo' md: 'https://shopify.dev/docs/api/hydrogen/2023-10/components/seo.md' --- # Seo The `` component renders SEO meta tags in the document `head`. Add the `` to your `root.jsx` before the `` and `` components. SEO metadata is set on a per-route basis using Remix [loader functions](https://remix.run/docs/en/v1/guides/data-loading). Learn more about [how SEO works in Hydrogen](https://shopify.dev/docs/custom-storefronts/hydrogen/seo). ## Props * debug boolean Enable debug mode that prints SEO properties for route in the console Examples ### Examples * #### Example code ##### Description I am the default example ##### JavaScript ```js import {Seo} from '@shopify/hydrogen'; import { Links, Meta, Outlet, Scripts, ScrollRestoration, } from '@remix-run/react'; export default function App() { /** ... */ return ( {/* Add before and */} ); } ``` ##### TypeScript ```ts import {Seo} from '@shopify/hydrogen'; import { Links, Meta, Outlet, Scripts, ScrollRestoration, } from '@remix-run/react'; export default function App() { /** ... */ return ( {/* Add before and */} ); } ```