UI Generator

Select theme appearance

Breadcrumbs

Breadcrumbs display the current page or context within the site, allowing them to navigate different levels of the hierarchy.

Link to section titled: Component

Component

Breadcrumbs

- html 
<!-- COMPONENT-START: nc-breadcrumbs -->
<nav>
    <ol class="nc-list-reset nc-cluster -nogap nc-breadcrumbs">
        <li class="nc-breadcrumb-item"><a class="nc-breadcrumb-link" href="#">NordCode</a></li>
        <li class="nc-breadcrumb-item"><a class="nc-breadcrumb-link" href="#">Team</a></li>
        <li class="nc-breadcrumb-item"><a class="nc-breadcrumb-link" href="#" aria-current="page">Lukas</a></li>
    </ol>
</nav>
<!-- COMPONENT-END: nc-breadcrumbs -->
Link to section titled: Usage notes

Usage notes

  • Pay attention to detail here to get the styling just right and the list accessible.