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.
Top comments (1)
Thank you for such a great post. You can also use this package for having more features like wildcard activation and... Just give it a try :)