Breadcrumb schema is implemented on interior pages

When Google displays breadcrumbs in search results — the path hierarchy shown beneath the page title — it pulls from BreadcrumbList schema-org markup, not from the visible UI component on your page. Interior pages without BreadcrumbList JSON-LD miss the SERP breadcrumb display even if a visible breadcrumb component exists. For sites with nested URL structures (/docs/getting-started, /blog/category/post), breadcrumb trails in search results improve click-through rates by communicating page context before the user clicks. A visible breadcrumb UI without corresponding schema is a common implementation gap that leaves this benefit unclaimed.

Create a reusable BreadcrumbSchema server component and render it from interior page layouts. Each itemListElement entry needs position (1-based), name, and item (absolute URL — omit item only on the current page).

// components/breadcrumb-schema.tsx
type Crumb = { name: string; href?: string }

export function BreadcrumbSchema({ crumbs }: { crumbs: Crumb[] }) {
  const schema = {
    '@context': 'https://schema.org',
    '@type': 'BreadcrumbList',
    itemListElement: crumbs.map((crumb, i) => ({
      '@type': 'ListItem',
      position: i + 1,
      name: crumb.name,
      ...(crumb.href ? { item: `https://yoursite.com${crumb.href}` } : {}),
    })),
  }
  return (
    <script
      type="application/ld+json"
      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
    />
  )
}

Add <BreadcrumbSchema> to your blog post, docs, and product detail layouts — not the root layout, since the homepage has no breadcrumb hierarchy.

• ID: marketing-advanced-seo.structured-data.breadcrumb-schema

• Severity: low

• What to look for: Count all interior pages with hierarchical URLs. Enumerate which have BreadcrumbList schema vs. which lack it. Look for BreadcrumbList schema in JSON-LD blocks on interior pages (pages with a URL depth of 2 or more, e.g., /blog/my-post, /docs/getting-started, /products/widget). Also check for a visible breadcrumb UI component — if one exists visually, check whether it has corresponding JSON-LD schema markup.

• Pass criteria: Pages at URL depth 2+ have BreadcrumbList JSON-LD with at least 2 ListItem entries that match the URL path hierarchy. At least 80% of hierarchical pages should have BreadcrumbList schema.

• Fail criteria: Interior pages at depth 2+ exist but have no BreadcrumbList schema. A visible breadcrumb UI exists but has no corresponding JSON-LD.

• Skip (N/A) when: The project has no pages at URL depth 2 or greater (all routes are top-level: /about, /pricing, etc., with no nested paths).

• Cross-reference: For URL structure best practices, see the url-structure check.

• Detail on fail: "Interior pages at depth 2+ exist (e.g., /blog/[slug]) but no BreadcrumbList JSON-LD found. A visible breadcrumb component was detected without corresponding schema markup."

• Remediation: Breadcrumb schema can trigger breadcrumb trails in search results, showing the page's path hierarchy directly in the SERP. Add a BreadcrumbList JSON-LD block alongside your other page schema. The itemListElement array should contain one ListItem per level of the breadcrumb path, each with position (1-based integer), name (display label), and item (absolute URL for all items except the current page).

  // components/breadcrumb-schema.tsx — add to interior page layouts
  const breadcrumbSchema = { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [...] }