Generate BreadcrumbList JSON-LD for SEO.
Tip: use samples, upload, copy, download, and send-to actions inside the workspace where available.
Breadcrumb Schema Generator is a free, browser-based tool that helps you produce ready-to-use output in seconds. Generate BreadcrumbList JSON-LD for SEO. It's built for speed and privacy: Everything runs locally in your browser — your data is never uploaded to a server. No sign-up, no installs, and no daily limits.
Generate a sample or helper artifact, then copy it into the workflow that needs it.
Review the preview, copy or download the result, and keep everything local in your browser.
Canonical Tag Generator: Generate a rel=canonical link tag to avoid duplicate content.
Open toolEach path segment becomes one level, with hyphens and underscores turned into spaces and every word title-cased. Edit the generated labels below — the auto-derived names are a starting point, not the real page titles.
Google replaces the URL line with this trail, so a clean hierarchy reads better than a long path.
<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": "Docs",
"item": "https://example.com/docs"
},
{
"@type": "ListItem",
"position": 3,
"name": "Guides",
"item": "https://example.com/docs/guides"
},
{
"@type": "ListItem",
"position": 4,
"name": "Getting Started",
"item": "https://example.com/docs/guides/getting-started"
}
]
}
</script><nav aria-label="Breadcrumb">
<ol itemscope itemtype="https://schema.org/BreadcrumbList">
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a itemprop="item" href="https://example.com/">
<span itemprop="name">Home</span>
</a>
<meta itemprop="position" content="1" />
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a itemprop="item" href="https://example.com/docs">
<span itemprop="name">Docs</span>
</a>
<meta itemprop="position" content="2" />
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a itemprop="item" href="https://example.com/docs/guides">
<span itemprop="name">Guides</span>
</a>
<meta itemprop="position" content="3" />
</li>
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a itemprop="item" href="https://example.com/docs/guides/getting-started">
<span itemprop="name">Getting Started</span>
</a>
<meta itemprop="position" content="4" />
</li>
</ol>
</nav>position is 1-based and must be contiguous with no gaps — it is generated from list order here, so reordering renumbers automatically.item because it is the page the user is already on. Every earlier level requires an absolute URL.<nav> if you also want a visible breadcrumb — it satisfies the markup and the UI in one place. Use JSON-LD when the visible trail is rendered by a framework component.