Index of every page on this site: llms.txt
Unhead
Svelte
Get Started

Install Unhead Schema.org

Copy for LLMs
On this page

Setup

1. Install the Package

Install @unhead/schema-org in your project:

yarn add @unhead/schema-org

2. Configure Schema.org Params

At a minimum, provide a host:

<script lang="ts">
  import { useHead } from '@unhead/svelte'

  useHead({
    templateParams: {
      schemaOrg: {
        host: 'https://example.com',
      }
    }
  })
</script>

See Schema.org Params for all available options.

3. Add Site Schema.org

Import from the Svelte adapter so useSchemaOrg() gets the head instance from Svelte context and registers component cleanup:

<script lang="ts">
  import { defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org/svelte'

  useSchemaOrg([
    defineWebSite({ name: 'Example Site' }),
    defineWebPage(),
  ])
</script>

Recommended: Vite Plugin

The Vite plugin can tree-shake server-only code and transform head composables at build time:

vite.config.ts
import { svelte } from '@sveltejs/vite-plugin-svelte'
import { Unhead } from '@unhead/svelte/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [svelte(), Unhead()],
})

Optional: Auto-Imports

The Svelte adapter exports an auto-import preset:

vite.config.ts
import { schemaOrgAutoImports } from '@unhead/schema-org/svelte'
import AutoImport from 'unplugin-auto-import/vite'

export default defineConfig({
  plugins: [
    AutoImport({
      imports: schemaOrgAutoImports,
    }),
  ],
})

Next Steps

  1. Choose an Identity
  2. Set up your pages with Schema.org Params
  3. Follow a recipe:
Edit this page
Markdown For LLMs
Did this page help you?

Streaming SSR

Wrap a Svelte SSR response with Unhead's streaming document shell

Install Unhead in TypeScript Projects

Set up Unhead with pure TypeScript. Framework-agnostic head management with createHead() and useHead() for SSR and client-side apps.