Squarespace 7.1 doesn't include breadcrumb navigation by default (except on product pages). You can add breadcrumbs manually using a code block with semantic HTML and structured data for SEO.
Place a code block at the top of your page content and style it to sit flush against the top of the section. Use the structured data markup to help search engines understand your site hierarchy.
/* Add this HTML via a Code Block:
<nav class="breadcrumbs" aria-label="Breadcrumb">
<a href="/">Home</a>
<span class="sep">/</span>
<a href="/services">Services</a>
<span class="sep">/</span>
<span class="current">Web Design</span>
</nav>
*/
.breadcrumbs {
font-size: 13px;
color: #888;
margin-bottom: 20px;
}
.breadcrumbs a {
color: #888;
text-decoration: none;
}
.breadcrumbs a:hover { color: #111; }
.breadcrumbs .sep { margin: 0 8px; }
.breadcrumbs .current { color: #333; font-weight: 600; }Generate this with our Nav CustomizerTry it free →
