Build a valid JSON-LD BreadcrumbList schema by adding your page trail's name and URL for each step — with a live visual preview and instant copy-ready code.
Add at least one item with a name and URL to see a preview.
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": []
}A BreadcrumbList is a schema.org type containing an ordered array called itemListElement, where each entry is a ListItem with three properties: position (a 1-indexed integer marking its place in the trail), name (the text label shown for that step), and item (the absolute URL that step links to). The final item in the list — representing the current page itself — is technically allowed to omit its item URL under the schema.org spec (since a page doesn't need to link to itself), though including it causes no harm and this tool includes it for every entered item for simplicity and consistency. The whole structure is wrapped in a script tag with type="application/ld+json", which keeps the structured data completely separate from your page's visible HTML and CSS — search engines read it directly from that script tag, independent of how (or whether) you also render a visible breadcrumb trail in your page's design.
Paste the copied JSON-LD inside a script tag — <script type="application/ld+json">...</script> — placed anywhere in your page's HTML, though the <head> section is the most common and conventional location. Unlike some older structured data formats (like Microdata or RDFa, which require special HTML attributes woven directly into your visible markup), JSON-LD is fully self-contained and invisible to visitors, which is exactly why it's schema.org's and Google's recommended format today — you can add rich structured data without touching or risking your page's visible design, CSS, or accessibility markup at all. If you're using a CMS like WordPress, Shopify, or a Next.js/React site, this usually means dropping the JSON-LD into a template, a custom HTML block, or (in a React-based site) directly into a script tag using dangerouslySetInnerHTML, the same technique this tool's own pages use for their own structured data.
After adding the generated code to your live page, it's worth validating it with Google's Rich Results Test or the schema.org validator, both of which parse your page's actual markup and confirms whether the BreadcrumbList is recognized correctly and eligible for rich results — catching issues like a missing required property or a malformed URL before they become invisible failures in production. Because this tool only ever includes an item in the generated schema once it has both a non-empty name and URL, the output itself is always structurally valid JSON-LD; validation with Google's tools is still worthwhile to confirm the live, deployed version of your page matches what you intended and that Google can actually crawl and parse the script tag correctly.
While the SEO upside — the chance of an enhanced search result — is the most commonly cited reason to add this schema, breadcrumb navigation itself (the visible trail, which this schema should accurately describe) is also a genuinely useful usability pattern independent of search engines entirely: it orients visitors within a deep site hierarchy, offers an easy way to jump back up to a parent category without using the browser's back button repeatedly, and reduces the perceived complexity of large, deeply-nested sites like e-commerce catalogs or documentation hubs. Building accurate BreadcrumbList schema alongside (and matching) a real, visible breadcrumb UI serves both purposes at once — better usability for humans, and better structured data for search engines — from a single, consistent source of truth about your site's navigation.
Breadcrumb Schema Generator builds one piece of structured data. These related SEO tools generate other common schema and metadata types.