Make navbar navigation links active in Laravel

Laravel

Make navbar navigation links active in Laravel

It looks much better if the current page that we are on is highlighted in the navbar. It tells the user which page he is on and it adds to the visuals of the application.

With Laravel, it is relatively easy to achieve highlighted nav links.

In order to achieve this, we will make an if check in the element class and conditionally add an active class if the condition is true.

The condition will be whether the current route matches the one we want to highlight like so.

@if(Request::is('a-route-name')) active @endif"


In a real example, we would probably have a list with navigation links inside.

<li class="nav-item">
    <a class="nav-link @if(Request::is('about')) active @endif" href="{{ route('frontend.about') }}">About</a>
</li>


That is it. A simple solution to highlight an active navigation link.

Show comments

Laravel

5 min

How to make Laravel authentication

Laravel provides a neat function that quickly generates a scaffold of routes, views, and controllers used for authentication.

Laravel

7 min

How to install Laravel application

This article will cover how to install and create a local development environment for your Laravel application. There are only a couple of steps that needs to be done.

Laravel

3 min

How to set appropriate Laravel permissions on Linux server

After publishing your Laravel application to a real web server, you discover then some of your functionalities are failing.

Codinary