richpeers's avatar

Blade Directive to add a Class to Active URL Links

Making a custom blade directive that adds a class to active links.

Template usage like:

class="@active('path', 'active-class')"
<a class="@active('projects/create', 'active')" href="{{ url('projects/create') }}">Create</a>
<li class="nav-item @active('profile/*', 'active')">

Edit app\Providers\AppServiceProvider.php

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Blade;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Bootstrap any application services.
     *
     * @return void
     */
    public function boot()
    {
        Blade::directive('active', function ($expression) {
            list($pattern, $class) = explode(',', str_replace(['(',')', ' ', "'"], '', $expression));
            return "<?= request()->is('$pattern') ? '$class' : ''; ?>";
        });
    }

    /**
     * Register any application services.
     *
     * @return void
     */
    public function register()
    {
        //
    }
}

Don't forget to run:

php artisan view:clear
0 likes
0 replies

Please or to participate in this conversation.