Install Unhead Schema.org with Solid.js · Unhead

[Unhead Home](https://unhead.unjs.io/ "Home")

- [Docs](https://unhead.unjs.io/docs/solid-js/head/guides/get-started/overview)
- [Tools](https://unhead.unjs.io/tools)
- [Learn](https://unhead.unjs.io/learn/guides/what-is-capo)

[Releases](https://unhead.unjs.io/releases)

Search…```k`` /`

[Unhead on GitHub](https://github.com/unjs/unhead)

[User Guides](https://unhead.unjs.io/docs/solid-js/head/guides/get-started/overview)

[API](https://unhead.unjs.io/docs/solid-js/head/api/get-started/overview)

[Releases](https://unhead.unjs.io/docs/solid-js/releases/v3)

Solid.js

- [Switch to Solid.js](https://unhead.unjs.io/docs/solid-js/head/guides/get-started/installation)
- [Switch to TypeScript](https://unhead.unjs.io/docs/typescript/head/guides/get-started/installation)
- [Switch to Vue](https://unhead.unjs.io/docs/vue/head/guides/get-started/installation)
- [Switch to React](https://unhead.unjs.io/docs/react/head/guides/get-started/installation)
- [Switch to Svelte](https://unhead.unjs.io/docs/svelte/head/guides/get-started/installation)
- [Switch to Angular](https://unhead.unjs.io/docs/angular/head/guides/get-started/installation)
- [Switch to Nuxt](https://unhead.unjs.io/docs/nuxt/head/guides/get-started/installation)

v3 (stable)

Schema.org

- [Discord Support](https://discord.com/invite/275MBUBvgP)

- Get Started
  - [Introduction](https://unhead.unjs.io/docs/solid-js/schema-org/guides/get-started/overview)
- Core Concepts
  - [Deduping Nodes](https://unhead.unjs.io/docs/solid-js/schema-org/guides/core-concepts/deduping-nodes)
  - [Supported Nodes](https://unhead.unjs.io/docs/solid-js/schema-org/guides/core-concepts/nodes)
  - [Schema.org Params](https://unhead.unjs.io/docs/solid-js/schema-org/guides/core-concepts/params)
- Recipes
  - [Custom Nodes](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/custom-nodes)
  - [Identity](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/identity)
  - [Blog](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/blog)
  - [Breadcrumbs](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/breadcrumbs)
  - [eCommerce](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/e-commerce)
  - [FAQ](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/faq)
  - [How To](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/how-to)
  - [Site Search](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/site-search)

Get Started

# Install Unhead Schema.org with Solid.js

[Copy for LLMs](https://raw.githubusercontent.com/unjs/unhead/refs/heads/main/docs/0.solid-js/schema-org/guides/get-started/0.installation.md)

Last updated Apr 9, 2026 by [Harlan Wilton](https://github.com/harlan-zw) in [refactor(bundler)!: named Unhead export, ctx-based transforms, dev-mode validate (#733)](https://github.com/unjs/unhead/pull/733).

On this page

- [Setup](#setup)
- [Schema.org Configuration Options](#schemaorg-configuration-options)
- [Recommended: Vite Plugin](#recommended-vite-plugin)
- [Optional: Auto-Imports](#optional-auto-imports)
- [Using Schema.org with Reactivity](#using-schemaorg-with-reactivity)
- [Next Steps](#next-steps)

## [Setup](#setup)

1. Install `@unhead/schema-org` dependency to your project:

yarn

npm

pnpm

```
yarn add -D @unhead/schema-org
```

```
npm install -D @unhead/schema-org
```

```
pnpm add -D @unhead/schema-org
```

1. Setup with Solid.js

Import and use Schema.org with Solid.js:

```
import { UnheadSchemaOrg, useSchemaOrg } from '@unhead/schema-org'
import { createHead, UnheadContext } from '@unhead/solid-js'
import { render } from 'solid-js/web'
import App from './App'

// Create the head instance with the Schema.org plugin
const head = createHead({
  plugins: [
    UnheadSchemaOrg({
      // Configure Schema.org params
      host: 'https://example.com',
      // ... other options
    }),
  ]
})

// Provide it via context
render(() => (
  <UnheadContext.Provider value={head}>
    <App />
  </UnheadContext.Provider>
), document.getElementById('root'))
```

1. Add Schema.org nodes in your components:

```
import { defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org'

function SiteSchema() {
  // Add Schema.org structured data
  useSchemaOrg([
    // Define identity (Organization or Person)
    defineWebSite({
      name: 'My Awesome Website',
    }),
    defineWebPage(),
  ])

  return null
}

// Use it in your App
function App() {
  return (
    <>
      <SiteSchema />
      {/* Rest of your app */}
    </>
  )
}
```

## [Schema.org Configuration Options](#schemaorg-configuration-options)

At a minimum you should provide a [host](https://developers.google.com/search/docs/advanced/crawling/consolidate-duplicate-urls) in your Schema.org configuration.

Here's a more complete example:

```
const head = createHead({
  plugins: [
    UnheadSchemaOrg({
      // Base URL for your site (required)
      host: 'https://example.com',

      // Default language
      defaultLanguage: 'en',

      // Organization or Person identity
      identity: {
        type: 'Organization',
        name: 'My Company',
        logo: 'https://example.com/logo.png',
      },

      // Enable debug mode for development
      debug: process.env.NODE_ENV !== 'production',
    }),
  ]
})
```

See the [Schema.org Params](https://unhead.unjs.io/docs/schema-org/guides/core-concepts/params) for all available options.

## [Recommended: Vite Plugin](#recommended-vite-plugin)

If you're using Vite, the [Vite plugin](https://unhead.unjs.io/docs/head/guides/build-plugins/overview) optimizes your production bundle by tree-shaking server-only code and transforming head composables at build time:

vite.config.ts

```
import solid from 'vite-plugin-solid'
import { Unhead } from '@unhead/solid-js/vite'

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

## [Optional: Auto-Imports](#optional-auto-imports)

If you're using Vite with [unplugin-auto-import](https://github.com/antfu/unplugin-auto-import), you can configure automatic imports for Schema.org composables:

vite.config.ts

```
import { schemaAutoImports } from '@unhead/schema-org'
import AutoImport from 'unplugin-auto-import/vite'
import { defineConfig } from 'vite'
import solidPlugin from 'vite-plugin-solid'

export default defineConfig({
  plugins: [
    solidPlugin(),
    AutoImport({
      imports: [
        // Auto-import Schema.org composables
        {
          '@unhead/schema-org': schemaAutoImports,
        },
      ],
    }),
  ]
})
```

## [Using Schema.org with Reactivity](#using-schemaorg-with-reactivity)

You can leverage Solid.js's reactivity system with Schema.org:

```
import { defineArticle, useSchemaOrg } from '@unhead/schema-org'
import { createResource, createSignal } from 'solid-js'

async function fetchArticleData(id) {
  const response = await fetch(\`/api/article/${id}\`)
  return response.json()
}

function ArticleSchema(props) {
  const [article] = createResource(() => props.id, fetchArticleData)

  useSchemaOrg(() => [
    defineArticle({
      headline: article()?.title || 'Loading...',
      description: article()?.summary || '',
      image: article()?.featuredImage || '',
      datePublished: article()?.publishDate || new Date().toISOString(),
      author: {
        name: article()?.author?.name || 'Anonymous',
      }
    })
  ])

  return null
}
```

## [Next Steps](#next-steps)

Your Solid.js app is now serving basic Schema.org structured data, congrats! 🎉

The next steps are:

1. Choose an [Identity](https://unhead.unjs.io/docs/schema-org/guides/recipes/identity)
2. Set up your pages for [Schema.org structures](https://unhead.unjs.io/docs/schema-org/guides/core-concepts/nodes)
3. Then follow some recipes:

- [Breadcrumbs](https://unhead.unjs.io/docs/schema-org/guides/recipes/breadcrumbs)
- [FAQ Page](https://unhead.unjs.io/docs/schema-org/guides/recipes/faq)
- [Site Search](https://unhead.unjs.io/docs/schema-org/guides/recipes/site-search)

[Edit this page](https://github.com/unjs/unhead/edit/main/docs/0.solid-js/schema-org/guides/get-started/0.installation.md)

[Markdown For LLMs](https://raw.githubusercontent.com/unjs/unhead/refs/heads/main/docs/0.solid-js/schema-org/guides/get-started/0.installation.md)

Did this page help you?

[Streaming Stream head tags as Suspense boundaries resolve during SolidJS SSR](https://unhead.unjs.io/docs/solid-js/head/guides/core-concepts/streaming) [Installation Set up Unhead in Svelte with createHead() and useHead(). Advanced features beyond svelte:head for SEO, structured data, and scripts.](https://unhead.unjs.io/docs/svelte/head/guides/get-started/installation)

On this page

- [Setup](#setup)
- [Schema.org Configuration Options](#schemaorg-configuration-options)
- [Recommended: Vite Plugin](#recommended-vite-plugin)
- [Optional: Auto-Imports](#optional-auto-imports)
- [Using Schema.org with Reactivity](#using-schemaorg-with-reactivity)
- [Next Steps](#next-steps)

[GitHub](https://github.com/unjs/unhead) [ Discord](https://discord.com/invite/275MBUBvgP)

[ /llms.txt](https://unhead.unjs.io/llms.txt)

[Part of the UnJS ecosystem](https://unjs.io/)

### Head Management

- [Getting Started](https://unhead.unjs.io/docs/solid-js/head/guides/get-started/overview)
- [useHead](https://unhead.unjs.io/docs/solid-js/head/api/composables/use-head)
- [useSeoMeta](https://unhead.unjs.io/docs/solid-js/head/api/composables/use-seo-meta)
- [useHeadSafe](https://unhead.unjs.io/docs/solid-js/head/api/composables/use-head-safe)
- [useScript](https://unhead.unjs.io/docs/solid-js/head/api/composables/use-script)

### Schema.org

- [Getting Started](https://unhead.unjs.io/docs/solid-js/schema-org/guides/get-started/overview)
- [useSchemaOrg](https://unhead.unjs.io/docs/solid-js/schema-org/api/composables/use-schema-org)
- [Nodes](https://unhead.unjs.io/docs/solid-js/schema-org/guides/core-concepts/nodes)
- [Recipes](https://unhead.unjs.io/docs/solid-js/schema-org/guides/recipes/identity)

### Guides

- [Titles](https://unhead.unjs.io/docs/solid-js/head/guides/core-concepts/titles)
- [Streaming SSR](https://unhead.unjs.io/docs/solid-js/head/guides/core-concepts/streaming)
- [DOM Events](https://unhead.unjs.io/docs/solid-js/head/guides/core-concepts/dom-event-handling)
- [Plugins](https://unhead.unjs.io/docs/solid-js/head/guides/plugins/template-params)

### Tools

- [Meta Tag Generator](https://unhead.unjs.io/tools/meta-tag-generator)
- [OG Image Generator](https://unhead.unjs.io/tools/og-image-generator)
- [Schema.org Generator](https://unhead.unjs.io/tools/schema-generator)
- [Capo.js Analyzer](https://unhead.unjs.io/tools/capo-analyzer)

### Articles

- [What is Capo.js?](https://unhead.unjs.io/learn/guides/what-is-capo)

### Research

- [State of <head> in 2026](https://unhead.unjs.io/learn/research/state-of-head-2026)
- [Streaming Head Performance](https://unhead.unjs.io/learn/research/streaming-head-performance)
- [Capo.js Performance Research](https://unhead.unjs.io/learn/research/capo-performance-research)

Copyright © 2025-2026 Harlan Wilton - [MIT License](https://github.com/unjs/unhead/blob/main/license)