nuxt-x-schema
Breadcrumb
Schema.org BreadcrumbList JSON-LD component for navigation trail structured data.
Breadcrumb
The XSchemaBreadcrumb component injects a <script type="application/ld+json"> tag for breadcrumb navigation structured data. No visible output — SEO only.
Components
<XSchemaBreadcrumb />
Place on any page that has a navigable breadcrumb trail. The component auto-converts relative URLs to absolute using a base domain.
<XSchemaBreadcrumb
:items="[
{ label: 'Home', to: '/' },
{ label: 'Blog', to: '/blog' },
{ label: 'My Post' }
]"
/>
Props
| Prop | Type | Required | Description |
|---|---|---|---|
items | BreadcrumbItem[] | Yes | Array of breadcrumb items. Each item: { label, name, to, item }. The last item (current page) should omit to/item |
AI Context
component: XSchemaBreadcrumb
package: "@xenterprises/nuxt-x-schema"
output: JSON-LD script tag in <head>
use-when: Adding BreadcrumbList structured data to pages with a navigation trail
place: In page-level components (pages/ or layouts/), NOT in shared headers
notes:
- Renderless component — no visible DOM output; purely SEO metadata
- Injects JSON-LD server-side via useHead — SSR-safe, visible to crawlers on first paint
- Auto-converts relative URLs to absolute using a base domain
- Last breadcrumb item (current page) should omit to/item