Breadcrumb

A breadcrumb trail on a page indicates the page's position in the site hierarchy. A user can navigate all the way up in the site hierarchy, one level at a time, by starting from the last breadcrumb in the breadcrumb trail.

Examples

Google Search uses breadcrumb markup in the body of a web page to categorize the information from the page in search results. Often, as illustrated in following use cases, users can arrive at a page from very different types of search queries. While each search may return the same web page, the breadcrumb categorizes the content within the context of the Google Search query. The page ancillaryjustice.html might display the following breadcrumb trails depending upon the search context:

A search query for the book title "Ancillary Justice" may generate the following breadcrumb:

Books › Authors › Ann Leckie › Ancillary Justice

Here's an example in JSON-LD to support that breadcrumb:

A search query for a year and genre-based award, "2014 Nebula Award best novel", may generate the following breadcrumb:

Books › Science Fiction › Ancillary Justice

RDFa

Here's an example in RDFa to support that breadcrumb:

Microdata

Here's an example in Microdata to support that breadcrumb:

Here's an example of a multiple breadcrumb trail:

Books › Science Fiction › Award Winners
Literature › Speculative Fiction

RDFa

Here's the example RDFa to support that breadcrumb:

<ol vocab="https://schema.org/" typeof="BreadcrumbList">
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books">
 Books</a>
 <meta property="position" content="1">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books/sciencefiction">
 Science Fiction</a>
 <meta property="position" content="2">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/books/sciencefiction/awardwinners">
 Award Winners</a>
 <meta property="position" content="3">
 </li>
</ol>
<ol vocab="https://schema.org/" typeof="BreadcrumbList">
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/literature">
 Literature</a>
 <meta property="position" content="1">
 </li>
 ›
 <li property="itemListElement" typeof="ListItem">
 <a property="item" typeof="WebPage"
 href="https://example.com/literature/speculativefiction">
 Speculative Fiction</a>
 <meta property="position" content="2">
 </li>
</ol>

Microdata

Here's the example Microdata to support that breadcrumb:

<ol itemscope itemtype="https://schema.org/BreadcrumbList">
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemtype="https://schema.org/Thing"
 itemprop="item" href="https://example.com/books">
 Books</a>
 <meta itemprop="position" content="1" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemtype="https://schema.org/Thing"
 itemprop="item" href="https://example.com/books/sciencefiction">
 Science Fiction</a>
 <meta itemprop="position" content="2" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemtype="https://schema.org/Thing"
 itemprop="item" href="https://example.com/books/sciencefiction/awardwinners">
 Award Winners</a>
 <meta itemprop="position" content="3" />
 </li>
</ol>
<ol itemscope itemtype="https://schema.org/BreadcrumbList">
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemtype="https://schema.org/Thing"
 itemprop="item" href="https://example.com/literature">
 Literature</a>
 <meta itemprop="position" content="1" />
 </li>
 ›
 <li itemprop="itemListElement" itemscope
 itemtype="https://schema.org/ListItem">
 <a itemtype="https://schema.org/Thing"
 itemprop="item" href="https://example.com/literature/speculativefiction">
 Speculative Fiction</a>
 <meta itemprop="position" content="2" />
 </li>
</ol>

HTML Example

Insert the HTML breadcrumb block within the page as part of the visual design. The HTML breadcrumb trail for the Guidelines example might be:

<ol>
  <li>
    <a href="http://www.example.com/books">Books</a>
  </li>
  <li>
    <a href="http://www.example.com/sciencefiction">Science Fiction</a>
  </li>
  <li>
    <a href="http://www.example.com/books/sciencefiction/awardwinners">Award Winners</a>
  </li>
<ol>

Guidelines

In addition to the general structured data guidelines, Social Profile markup should create one or more breadcrumb trails without a crumb for the target page if it's possible to find the page within a larger set of search results. Continuing the previous examples, because the search query award winning science fiction novels would find many other pages in addition to ancillaryjustice.html, you might include the breadcrumb trail to reflect the broader search category:

Books › Science Fiction › Award Winners

Structured data type definitions

Google Search recognizes the following properties of a BreadcrumbList. You must include the required properties for your content to be eligible for display as a rich result.

Required properties

Required properties
`item`	`Thing` The URL to the webpage that represents the breadcrumb.
`name`	`Text` The title of the breadcrumb displayed for the user.
`position`	`Integer` The position of the breadcrumb in the breadcrumb trail. Position 1 signifies the beginning of the trail.

item

Thing

The URL to the webpage that represents the breadcrumb.

name

Text

The title of the breadcrumb displayed for the user.

position

Integer

The position of the breadcrumb in the breadcrumb trail. Position 1 signifies the beginning of the trail.

Examples

HTML Example

Guidelines

Structured data type definitions

Send feedback about...