Breadcrumbs

Documentation on how to use breadcrumbs.

Note: GCWeb vX.0 are no longuer compatible with the pre 2019 megamenu pattern (GCWEB v4.x) that was taking the full page width.

Recommendation

• The page title should not be included within the breadcrumbs list items.

Here is the html output with structured data in RDFa format for the above breadcrumb example:

<nav id="wb-bc" property="breadcrumb">
			<h2>You are here:</h2>
			<div class="container">
				<ol class="breadcrumb" typeof="BreadcrumbList">
					<li property="itemListElement" typeof="ListItem">
						<a property="item" typeof="WebPage" href="https://www.canada.ca/en.html">
							<span property="name">Canada.ca</span>
						</a>
						<meta property="position" content="1">
					</li>
					<li property="itemListElement" typeof="ListItem">
						<a property="item" typeof="WebPage" href="https://wet-boew.github.io/GCWeb/index-en.html">
							<span property="name">GCWeb home</span>
						</a>
						<meta property="position" content="2">
					</li>
					<li property="itemListElement" typeof="ListItem">
						<a property="item" typeof="WebPage" href="https://wet-boew.github.io/GCWeb/méli-mélo/méli-mélo-en.html">
							<span property="name">Méli-mélo</span>
						</a>
						<meta property="position" content="3">
					</li>
				</ol>
			</div>
		</nav>