Manage menus, breadcrumbs, and other navigational elements in Laravel apps

Laravel Navigation is meant to be the spiritual successor of Laravel Menu. Laravel Menu will still be actively maintained, but there are a few principal differences between the two packages.

The main goal of Laravel Menu is to build HTML menus from PHP. Laravel Navigation describes an application’s navigation tree, which can be used as a base to create navigational elements like menus and breadcrumbs. Laravel Menu has a rich API for HTML generation. Laravel Navigation doesn’t do any HTML generation (although we might ship some Blade files in the future). Instead, Laravel Navigation should give you the flexibility to build your own UI without worrying about the complexity of navigation trees and active state. Think of it as a renderless component.

Navigation::make()
    ->add('Home', route('home'))
    ->add('Blog', route('blog.index'), fn (Section $section) => $section
        ->add('All posts', route('blog.index'))
        ->add('Topics', route('blog.topics.index'))
    )
    ->addIf(
        Auth::user()->isAdmin(),
        'Admin',
        route('admin.index'),
        fn (Section $section) => $section->add('Create post', route('blog.create'))
    );

If you want to register your navigation in a service provider, which is recommended, you can use the Laravel container events to add items to the navigation.

namespace App\Providers;

use Illuminate\Support\ServiceProvider;
use Spatie\Navigation\Navigation;
use Spatie\Navigation\Section;

class NavigationServiceProvider extends ServiceProvider
{
    public function register(): void
    {
        $this->app->resolving(Navigation::class, function (Navigation $navigation): Navigation {
            return $navigation
                ->add('Home', route('home'))
                ->add('Blog', route('blog.index'), fn (Section $section) => $section
                    ->add('All posts', route('blog.index'))
                    ->add('Topics', route('blog.topics.index'))
                )
                ->addIf(
                    Auth::user()->isAdmin(),
                    'Admin',
                    route('admin.index'),
                    fn (Section $section) => $section->add('Create post', route('blog.create'))
                );
        });
    }
}

A navigation object can be rendered to a tree, or to breadcrumbs.

Some examples when visiting /blog/topics/laravel:

// Render to tree
Navigation::make()->tree();

[
    { "title": "Home", "url": "/", "active": false, "attributes": [], "children": [], "depth": 0 },
    {
        "title": "Blog",
        "url": "/blog",
        "active": false,
        "attributes": [],
        "children": [
            { "title": "All posts", "url": "/blog", "active": false, "attributes": [], "children": [], "depth": 1 },
            { "title": "Topics", "url": "/blog/topics", "active": true, "attributes": [], "children": [], "depth": 1 }
        ],
        "depth": 0
    },
    {
        "title": "Admin",
        "url": "/admin",
        "active": false,
        "attributes": [],
        "children": [
            { "title": "Create post", "url": "/blog/create", "active": false, "attributes": [], "children": [], "depth": 1 }
        ],
        "depth": 0
    }
]

// Append additional pages in your controller
Navigation::make()->activeSection()->add($topic->name, route('blog.topics.show', $topic));

// Render to breadcrumbs
Navigation::make()->breadcrumbs();

[
    { "title": "Blog", "url": "/blog", "attributes": [] },
    { "title": "Topics", "url": "/blog/topics", "attributes": [] },
    { "title": "Laravel", "url": "/blog/topics/laravel", "attributes": [] }
]

// Render the current section
Navigation::make()->current();

{ "title": "Home", "url": "/", "attributes": [] }

Support us

We invest a lot of resources into creating best in class open source packages. You can support us by buying one of our paid products.

We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You’ll find our address on our contact page. We publish all received postcards on our virtual postcard wall.

Installation

You can install the package via composer:

composer require spatie/laravel-navigation

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security

If you’ve found a bug regarding security please mail [email protected] instead of using the issue tracker.

Credits

• Sebastian De Deyne
• All Contributors

License

The MIT License (MIT). Please see License File for more information.