How to Create and Implement Breadcrumb Schema in a Website

Author
POSTED BY: Rohith Sasanken / January 27, 2026
Views
0 Views
Comments
0 Comments

Breadcrumb schema helps search engines understand the hierarchical structure of a website and how individual pages relate to each other. When implemented correctly, Google can display breadcrumb paths in search results instead of long URLs, making listings clearer and easier for users to understand.

This guide explains what Breadcrumb schema is, when it should be used, and how to create and implement it step by step using JSON-LD and HTML-based markup, with clean, schema-valid examples you can apply directly to a website.

What Is a Breadcrumb Schema?

Breadcrumb schema (BreadcrumbList) is structured data that represents a navigation trail showing a page’s position within a website’s hierarchy.

A breadcrumb trail typically looks like this:

breadcrumbs example in a website

This trail helps:

  • Users understand where they are on a site
  • Users navigate back to higher-level pages
  • Search engines understand site structure and content relationships

When breadcrumb schema is present, Google may replace the URL in search results with a breadcrumb path, improving clarity and click confidence.

Where Breadcrumb Schema Appears in Google Search

Breadcrumbs can appear:

  • On desktop search results
  • Across all regions and languages where Google Search is available

Instead of displaying a long URL, Google may show a structured breadcrumb trail that reflects the page’s context.

When Should You Use Breadcrumb Schema?

Breadcrumb schema should be used on any website with a clear hierarchical structure.

Common use cases include:

  • Blogs with categories and subcategories
  • Service-based websites
  • E-commerce category and product pages
  • Educational websites
  • Large content-driven platforms

Breadcrumb schema is not limited to visible breadcrumbs, but the structured data must reflect a logical and user-friendly path.

Breadcrumb Schema vs URL Structure

Breadcrumb schema does not need to mirror the exact URL structure.

For example:

URL : example.com/services/seo/technical-audit

Breadcrumb trail
Home › SEO Services › Technical Audit

Google recommends representing a typical user navigation path, not a technical folder structure.

How Breadcrumb Schema Works

Breadcrumb schema uses the BreadcrumbList type, which contains multiple ListItem objects.

Each ListItem defines:

  • The position in the trail
  • The label shown to users
  • The URL of that level (optional for the last item)

A valid breadcrumb trail must contain at least two ListItems.

Core Components of Breadcrumb Schema

BreadcrumbList

This is the container that holds the entire breadcrumb trail.

Key responsibility:

  • Defines the ordered list of breadcrumb items

ListItem

Each breadcrumb step is defined using a ListItem.

Every ListItem must include:

  • position : order in the breadcrumb trail
  • name : label shown to users
  • item : URL of the page (not required for the last breadcrumb)

How to Create Breadcrumb Schema Using JSON-LD 

JSON-LD is the preferred format because it separates structured data from page layout and is easier to manage.

Example: Single Breadcrumb Trail (JSON-LD) : 

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [
    {
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://www.codestratz.com/"
    },
    {
      "@type": "ListItem",
      "position": 2,
      "name": "Digital Marketing Services",
      "item": "https://www.codestratz.com/digital-marketing-services/"
    },
    {
      "@type": "ListItem",
      "position": 3,
      "name": "Digital Advertising",
      "item": "https://www.codestratz.com/digital-marketing-services/digital-advertising/"
    },
    {
      "@type": "ListItem",
      "position": 4,
      "name": "Account-Based Marketing",
      "item": "https://www.codestratz.com/digital-marketing-services/digital-advertising/account-based-marketing/"
    }
  ]
}
</script>

Why the Last Item Has No URL

For the final breadcrumb:

  • The item property is optional
  • Google automatically uses the current page URL
  • This avoids redundancy and keeps markup clean

How to Create Breadcrumb Schema Using HTML Markup

Breadcrumbs can also be implemented using HTML-based structured data (such as Microdata or RDFa). This method embeds schema attributes directly into the page markup.

This approach works but is harder to maintain compared to JSON-LD.

Example: Breadcrumb Schema Using HTML Microdata

<nav itemscope itemtype="https://schema.org/BreadcrumbList">
  <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://www.codestratz.com/">
      <span itemprop="name">Home</span>
    </a>
    <meta itemprop="position" content="1">
  </span>
  <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://www.codestratz.com/digital-marketing-services/">
      <span itemprop="name">Digital Marketing Services</span>
    </a>
    <meta itemprop="position" content="2">
  </span>
  <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <a itemprop="item" href="https://www.codestratz.com/digital-marketing-services/digital-advertising/">
      <span itemprop="name">Digital Advertising</span>
    </a>
    <meta itemprop="position" content="3">
  </span>
  <span itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
    <span itemprop="name">Account-Based Marketing</span>
    <meta itemprop="position" content="4">
  </span>
</nav>

Multiple Breadcrumb Trails for One Page

Some pages can be reached through different navigation paths. In such cases, multiple breadcrumb trails can be defined.

Example use cases:

  • Blog posts under multiple categories
  • Products listed in more than one collection
  • Content accessible through topic-based and role-based navigation

Example: Multiple Breadcrumb Trails (JSON-LD)

<script type="application/ld+json">
[
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
      {
        "@type": "ListItem",
        "position": 1,
        "name": "Home",
        "item": "https://example.com/"
      },
      {
        "@type": "ListItem",
        "position": 2,
        "name": "Marketing Resources",
        "item": "https://example.com/marketing-resources"
      },
      {
        "@type": "ListItem",
        "position": 3,
        "name": "SEO Guides",
        "item": "https://example.com/marketing-resources/seo-guides"
      },
      {
        "@type": "ListItem",
        "position": 4,
        "name": "Breadcrumb Markup"
      }
    ]
  },
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
      {
        "@type": "ListItem",
        "position": 1,
        "name": "Home",
        "item": "https://example.com/"
      },
      {
        "@type": "ListItem",
        "position": 2,
        "name": "Developer Docs",
        "item": "https://example.com/developer-docs"
      },
      {
        "@type": "ListItem",
        "position": 3,
        "name": "Structured Data",
        "item": "https://example.com/developer-docs/structured-data"
      },
      {
        "@type": "ListItem",
        "position": 4,
        "name": "Breadcrumb Markup"
      }
    ]
  }
]
</script>

Google selects the most relevant breadcrumb path depending on the search query context.

Where to Place Breadcrumb Schema Code

Breadcrumb schema can be placed:

  • Inside the <head> section
  • Before the closing </body> tag

Both locations are valid as long as the markup is accessible to Googlebot.

How to Validate Breadcrumb Schema

Validation ensures Google can read and process your breadcrumb markup correctly.

Recommended Tools

  • Google Rich Results Test
  • Google Search Console URL Inspection

What to Check

  • At least two ListItems are present
  • Positions are sequential
  • Names match visible breadcrumb labels
  • URLs are crawlable

Fix critical errors first. Warnings should be reviewed but do not block eligibility.

Common Breadcrumb Schema Mistakes

  • Using breadcrumbs that don’t reflect user navigation
  • Skipping position values or duplicating them
  • Adding breadcrumb schema to pages without hierarchy
  • Using hidden or misleading breadcrumb labels
  • Mixing outdated data-vocabulary markup (no longer supported)

These issues can prevent breadcrumb enhancement in search results.

Best Practices for Breadcrumb Schema

  • Keep breadcrumb names short and readable
  • Reflect logical site hierarchy, not technical folders
  • Maintain consistency between visible breadcrumbs and schema
  • Use JSON-LD wherever possible
  • Apply breadcrumbs across all eligible pages, not selectively

Conclusion

Breadcrumb schema helps search engines understand a website’s structure and improves how pages are presented in search results. When implemented correctly, it enhances clarity without changing the user experience.

By defining logical breadcrumb trails, using clean structured data, and validating the markup properly, Breadcrumb schema becomes a powerful support element for both usability and search visibility.

By Rohith Sasanken

Rohith Sasanken, a digital marketing expert with 11+ years of experience, creates data-driven campaigns and impactful brand stories, collaborating with teams to ensure measurable growth and meaningful results