Laravel 9 Link Active Class Routes Example

saim - Nov 13 '22 -

In this section we will see how to use link active class routes in laravel 9. We will see active link routes in laravel with tailwind css and bootstrap 5.

Example 1

Laravel 9 simple active class link using request()->is('/') and ternary operator.

<li>
    <a href="/" class="{{ request()->is('/') ? 'text-blue-600':'' }}">Home</a>
</li>
<li>
    <a href="{{ route('vuejs') }}" class="{{ request()->is('vuejs') ? 'text-green-600':'' }}">Vue</a>
</li>

Example 2

Using routeIs to create active current routes links.

<li>
    <a href="/" class="{{ request()->routeIs('/') ? 'text-blue-600':'' }}">Home</a>
</li>
<li>
    <a href="{{ route('vuejs') }}" class="{{ request()->routeIs('vuejs') ? 'text-green-600':'' }}">Vue</a>
</li>

Example 3

You can also use laravel @class directive to active link class with tailwind css navbar links.

<li>
    <a href="{{ route('vuejs') }}" @class(['text-blue-600'=> request()->is('vuejs') ])>Test</a>
</li>

Example 4

laravel 9 active routes links with bootstrap 5.

<li class="nav-item">
    <a class="nav-link {{ request()->routeIs('/') ? 'active':'' }}" aria-current="page" href="/">Home</a>
</li>

If you Know more plz comment below.