University of St Andrews

Breadcrumbs

The breadcrumbs pattern indicates the current page's location within a navigational hierarchy in relation to the University's homepage.

Rules for the breadcrumbs

• Must not be used on the University's homepage or on long-form pages.
• Must be used at the top of content pages, sitting immediately beneath the navigation bar and above the page content.

Options available

• Default breadcrumbs

Default breadcrumbs

<!-- Begin pattern: breadcrumbs //-->
<div class="container">
    <div class="row">
        <div class="col-lg-12 content">
            <h2 class="sr-only">Breadcrumbs navigation</h2>
            <nav>
                <ul class="breadcrumbs">
                        <li><a href="#">University</a></li>
                        <li><a href="#">Study at St&nbsp;Andrews</a></li>
                    <li>Undergraduate</li>
                </ul>
            </nav>
        </div>
    </div>
</div>
<!-- End pattern: breadcrumbs //-->