Site code reference

Head and body snippets

The four snippet files that add raw content to every page's head and body, what goes in each, and what is refused.

Every page renders inside the Base layout, which you can't edit. For raw content that belongs on every page, Base includes four snippet files. They start empty and are entirely yours.

File	Renders	Use it for
`src/head/HeadStart.astro`	At the start of `<head>`, before the SEO tags	`<base href>`, `<link rel="preconnect">`, Content-Security-Policy `<meta http-equiv>`
`src/head/HeadEnd.astro`	At the end of `<head>`	Analytics and tag-manager scripts, `<link rel="preload">`, custom structured data (JSON-LD), custom non-SEO `<meta>` and `<link>` tags, inline critical CSS
`src/body/BodyStart.astro`	First thing in `<body>`, before the header	A skip link (`<a href="#main">`), a tag manager's `<noscript>` iframe
`src/body/BodyEnd.astro`	Last thing in `<body>`	Site-wide scripts, end-of-body analytics, floating widgets such as a cookie banner, back-to-top button or chat

A snippet file can import components. For structured data that differs per page, use Astro.url.pathname to tell pages apart. Third-party scripts usually need is:inline so they run exactly as written.

---
// src/head/HeadEnd.astro
const isHome = Astro.url.pathname === '/'
---

{isHome && (
  <script type="application/ld+json" is:inline set:html={JSON.stringify({
    '@context': 'https://schema.org',
    '@type': 'LocalBusiness',
    name: 'Example Bakery',
  })} />
)}

Where SEO tags come from instead

The Base layout writes every page's SEO tags from your SEO settings:

Per-page title, description, robots, social image: seo_set_page, or the SEO view.
Site name, default description, search visibility, verification codes, default social image, favicons: seo_set_defaults.
Canonical addresses come from your live domain and the page's path. You can't override them.

Pages don't pass SEO data to <Base> and don't read SEO files.

Head and body snippets

Where SEO tags come from instead

Related