Sobes.tech
Middle

How to make the last breadcrumb item non-clickable?

sobes.tech AI

Answer from AI

To make the last breadcrumb item non-clickable, it is usually displayed as plain text rather than a link. For example, in HTML:

<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="/home">Home</a></li>
    <li class="breadcrumb-item"><a href="/category">Category</a></li>
    <li class="breadcrumb-item active" aria-current="page">Current Page</li>
  </ol>
</nav>

Here, the last item has the class active and does not contain a link <a>, making it non-clickable and indicating that it is the current page.

If you are using JavaScript frameworks, simply do not wrap the last item in a link or disable the click handler.

How to make the last breadcrumb item non-clickable… - sobes.tech