Breadcrumb Generator: HTML and Schema
List the path to a page, from home to the current page, and get accessible breadcrumb navigation HTML plus matching BreadcrumbList structured data in JSON-LD.
How to use the breadcrumb generator
- List each level of the path, from Home to the current page, as Name | URL.
- Pick a separator for the visible breadcrumb.
- Copy the HTML where the breadcrumb should appear, usually above the H1.
- Copy the JSON-LD into the page, then test it with Google’s Rich Results Test.
Why breadcrumbs help
| For visitors | For search engines |
|---|---|
| Show where they are on the site | Explain how pages relate |
| One tap back to a category | Extra internal links to parent pages |
| Less confusion on deep pages | Breadcrumb schema can show in results |
Breadcrumb best practices
- Start with Home and end with the current page.
- Do not link the current page.
- Keep names short and match page titles.
- Use the same path in the HTML and the schema.
Add more structured data with the FAQ schema generator and organization schema generator, and validate it with the schema validator.
More free tools and guides
Learn this hands-on
Practise tools like this on real projects in our digital marketing course in Faridabad, with weekday, weekend and online batches.
See the courseAll free toolsAsk on WhatsApp
Frequently Asked Questions
Is this breadcrumb generator free?
Yes. It is free with no sign-up and works in your browser.
Does Google still show breadcrumbs in search?
Google shows breadcrumb paths in some results, mainly on desktop. Breadcrumb schema still helps Google understand your site structure.
Where should breadcrumbs go on the page?
Usually near the top, above the main heading.
Do I need both HTML and schema?
Yes, ideally. The HTML helps visitors; the schema describes the same path to search engines.