Why Your Site Needs Breadcrumbs & How to Add Them With JSON-LD / Schema Markup
Breadcrumbs help search engines and users understand where a page lives within your site. They look simple on the front end, but when you add structured data behind the scenes, they also become a useful signal to search engines, which ultimately improves SEO. A lot of site builders have built in features you can use, but if you're on the world's most archaic blogging platform like me, you might need to add them manually.
Breadcrumb schema markup is usually added with JSON-LD using the BreadcrumbList type from Schema.org when you don't have a website that automatically does it for you. Each item in the list represents a step in the page path, such as Home → Case Studies → current article, which then gives crawlers a clearer picture of your site structure and how the pages are related to each other.
Why do breadcrumbs matter?
Breadcrumbs are important because they support both usability and search visibility. For readers, they create a clean path back to broader sections of your website. When used correctly, breadcrumbs can also boost user engagement throughout your site and increase your overall average session time. For search engines, breadcrumbs provide hierarchy. The extra context can help Google understand category relationships, page depth, and internal linking structure. Breadcrumbs alone will not make a page rank overnight, but they work in tandem with all other elements of SEO.
They're especially useful on portfolio sites, blogs, case study libraries, e-commerce pages and really any website with multiple layers of content. If your pages live inside larger topic hubs, breadcrumb markup is one of the easiest ways to declare and clarify that structure.
How to use breadcrumbs in schema markup
The format is pretty straight forward..
I used "https://www.soriabio.com/2026/03/how-to-add-breadcrumbs-using-schema" as an example. You'll notice a pattern when you look at the URL vs. the sample code I've shared below and that's how you'll determine your own page breadcrumbs.
- My domain name is "soriabio." Since that's my homepage, it will always be number 1. It's at the very top of my heirarchy.
- My "path segment" or "slug" is: /2026/03/how-to-add-breadcrumbs-using-schema
Breaking it down is pretty simple. If you just remove the backslash ( / ) and enter a line break there instead, this is what you get:
- 2026
- 03
- how-to-add-breadcrumbs-using-schema-markup
- 1 = Home = soriabio.com/ ⟶
- 2 = Year 2026 ⟶ 2026/ ⟶
- 3 = March = 03/ ⟶
- 4 = How to Add Breadcrumbs to Your website = how-to-add-breadcrumbs-using-schema/
**Note** Use real URLs, keep the positions in order, starting with the domain and moving from the beginning of the slug to the end. Make sure the names match what your site users will actually see on the page. That keeps the markup clean and easier to validate.
Breadcrumb example & copy + paste code
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [
{
"@type": "ListItem",
"position": 1,
"item": {
"@id": "https://www.soriabio.com/",
"name": "Home"
}
},
{
"@type": "ListItem",
"position": 2,
"item": {
"@id": "https://www.soriabio.com/2026/",
"name": "Blog 2026"
}
},
{
"@type": "ListItem",
"position": 3,
"item": {
"@id": "https://www.soriabio.com/2026/03/",
"name": "Blog March 2026"
}
},
{
"@type": "ListItem",
"position": 4,
"item": {
"@id": "https://www.soriabio.com/2026/how-to-add-breadcrumbs-using-schema",
"name": "How to add breadcrumbs to website"
}
}
]
}
</script>
Once the code is added, run it through Google’s Rich Results Test or the Schema Markup Validator to make sure everything is clean and will actually function. Breadcrumbs are a small addition, but they are one of those technical details that help make your website feel more complete, organized, and easier for both people and robots to understand.
There are a plugins for WordPress and some WYSIWYG sites have them built in, but there are so many types of schema it's hard to say which ones they have built in.