PHPackages                             konekt/menu - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. konekt/menu

ActiveLibrary[Utility & Helpers](/categories/utility)

konekt/menu
===========

Menus in Laravel 10 - 12

1.13.0(1y ago)28103.9k—6.9%144[2 issues](https://github.com/artkonekt/menu/issues)1MITPHPPHP ^8.1CI passing

Since Oct 23Pushed 1y ago4 watchersCompare

[ Source](https://github.com/artkonekt/menu)[ Packagist](https://packagist.org/packages/konekt/menu)[ RSS](/packages/konekt-menu/feed)WikiDiscussions 1.x Synced 1mo ago

READMEChangelogDependencies (5)Versions (22)Used By (1)

Laravel Menu
============

[](#laravel-menu)

> This is a rework of [Lavary Menu](https://github.com/lavary/laravel-menu)

[![Tests](https://camo.githubusercontent.com/27b7ac3dba6fdb89a111c27d3cf718023a7c5d28f208d08f6555a7d761e925e1/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6172746b6f6e656b742f6d656e752f74657374732e796d6c3f6272616e63683d6d6173746572267374796c653d666c61742d737175617265)](https://github.com/artkonekt/menu/actions?query=workflow%3Atests)[![Stable packagist version](https://camo.githubusercontent.com/c0220d1c0ca174fa94bbeaa95eaa6ba78419459a0e2ee3b7a7380b7dde1fc83c/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6b6f6e656b742f6d656e752e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/konekt/menu)[![Packagist downloads](https://camo.githubusercontent.com/47d2abf836ea4808fa7b1795e536913815a36b787c99005d9338325dbcf37eab/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6b6f6e656b742f6d656e752e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/konekt/menu)[![StyleCI](https://camo.githubusercontent.com/2af729bdef827d7742a0571aa8d45b4ae11758709bbbeb1766608414f7176524/68747470733a2f2f7374796c6563692e696f2f7265706f732f39343537343836362f736869656c643f6272616e63683d6d6173746572)](https://styleci.io/repos/94574866)[![MIT Software License](https://camo.githubusercontent.com/942e017bf0672002dd32a857c95d66f28c5900ab541838c6c664442516309c8a/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d626c75652e7376673f7374796c653d666c61742d737175617265)](LICENSE.md)

A quick and easy way to create menus in [Laravel v5.4 - v11](https://laravel.com/)

Laravel Compatibility
---------------------

[](#laravel-compatibility)

LaravelMenu Module5.41.0 - 1.35.51.0 - 1.75.61.1 - 1.75.71.2 - 1.75.81.3 - 1.76.x1.4 - 1.97.x1.5 - 1.98.x1.7 - 1.99.x1.9 - 1.1010.x1.10+11.x1.11+12.x1.13+PHP Compatibility
-----------------

[](#php-compatibility)

PHPMenu Module7.01.0 - 1.27.11.0 - 1.57.21.1 - 1.77.31.3 - 1.97.41.5 - 1.98.01.8 - 1.108.11.9+8.21.10+8.31.10+8.41.12+Documentation
-------------

[](#documentation)

- [Installation](#installation)
- [Getting Started](#getting-started)
- [Sub-items](#sub-items)
- [Referring to Items](#referring-to-items)
    - [Get All Items](#get-all-items)
    - [Get Sub-items of the Item](#get-sub-items-of-the-item)
    - [Magic Where Methods](#magic-where-methods)
- [Referring to Menu Objects](#referring-to-menu-instances)
- [HTML Attributes](#html-attributes)
- [Manipulating Links](#manipulating-links)
    - [Link's Href Property](#links-href-property)
- [Active Item](#active-item)
    - [URL Wildcards](#url-wildcards)
    - [Check for Active Children](#check-for-active-children)
- [Inserting a Separator](#inserting-a-separator)
- [Append and Prepend](#append-and-prepend)
- [Meta Data](#meta-data)
- [Manipulating The Items](#manipulating-the-items)
- [Sorting the Items](#sorting-the-items)
- [Rendering](#rendering)
    - [Built-in Renderers](#built-in-renderers)
        - [Render As UL](#render-as-ul)
        - [Render As OL](#render-as-ol)
        - [Render As Div](#render-as-div)
    - [Custom Renderers](#custom-renderers)
- [Authorization](#authorization)
- [Configuration](#configuration)

Installation
------------

[](#installation)

```
composer require konekt/menu
```

Getting Started
---------------

[](#getting-started)

You can define the menus in a service provider's boot method, so any request hits your application, the menu objects will be available.

### Create A Menu

[](#create-a-menu)

```
$sidebar = Menu::create('sidebar');
$sidebar->addItem('Home',  '/');
$sidebar->addItem('About', 'about');
```

You can reference it later as `Menu::get('sidebar')`.

### Access Menu In Views

[](#access-menu-in-views)

If you want the make the menu object available across all application views pass the 'share' option for `create()`:

```
Menu::create('sidebar', null, ['share' => true]); // will be $sidebar in views
Menu::create('main', null, ['share' => 'mainMenu']); // will be $mainMenu in views
```

In a blade view:

```
{{-- Render with the built in 'ul' renderer --}}
{!! $mainMenu->render('ul') !!}

{{--Or render items manually--}}

    @foreach($mainMenu->items as $item)
        url }}">{{ $item->title }}
    @endforeach

```

### Adding Items

[](#adding-items)

```
$navbar = Menu::create('navbar');

// Simple link; to '/' via the URL helper
$navbar->addItem('home', 'Home', '/');

// Named route
$navbar->addItem('clients', 'Clients', ['route' => 'client.index']);
// Named route with parameter
$navbar->addItem('my-profile', 'My Profile', ['route' => ['user.show', 'id' => Auth::user()->id]]);

// Refer to an action
$navbar->addItem('projects', 'Projects', ['action' => 'ProjectController@index']);
// Action with parameter
$navbar->addItem('issue7', 'Issue 7', ['action' => ['IssueController@edit', 'id' => 7]]);
```

The `addItem()` method receives 3 parameters:

- the name of the item
- the title of the item
- and options

*options* can be a simple string representing a URL or an associative array of options and HTML attributes which is described below.

### Removing Items

[](#removing-items)

```
$menu = Menu::create('main');

$menu->addItem('home', 'Home', '/');
$menu->addItem('about', 'About', '/about');
$menu->getItem('about')->addSubItem('about-us', 'About Us', ['url' => '/about/us']);

// This will remove both about and about-us
$menu->removeItem('about');

// To keep children, set the second parameter `$removeChildren` to false:
$menu->removeItem('about', false); // about-us will remain
```

### Render The Menu

[](#render-the-menu)

This component provides 3 rendering methods out of the box, `ul`, `ol` and `div`. You can read about the details [here](#rendering-methods).

```
{!! $myMenu->render('ul') !!}
```

You can also access the menu object via the `Menu` facade:

```
{!! Menu::get('navbar')->render('ul') !!}
```

This will render your menu like this:

```

  Home
  About
  Services
  Contact

```

Sub-items
---------

[](#sub-items)

Items can have sub-items too:

```
$menu = Menu::create('uberGigaMenu')

$menu->addItem('about', 'About', ['route' => 'page.about']);
// these items will go under Item 'About'
// refer to about as a property of $menu object then call `addItem()` on it
$menu->about->addSubItem('who-we-are', 'Who We are', '/who-we-are');
// or
$menu->getItem('about')->addSubItem('what-we-do', 'What We Do', '/what-we-do');
// or
$menu->addItem('our-goals', 'Our Goals',[
            'parent' => 'about',
            'url' => '/our-goals'
        ]);
```

You can also chain the item definitions and go as deep as you wish:

```
$menu->addItem('about', 'About', '/about')
    ->addSubItem('level2', 'Level 2', '/about/level2')
        ->addSubItem('level3', 'Level 3', '/about/level2/level3')
            ->addSubItem('level4', 'Level 4', '/about/level2/level4');
```

It is possible to add sub items directly using `parent` attribute:

```
$menu->addItem('about', 'About');

// You can either set the item object directly as parent:
$menu->addItem('team', 'The Team', ['url' => '/about-the-team', 'parent' => $menu->about]);

// Or just simply the parent item's name:
$menu->addItem('board', 'The Board', ['url' => '/about-the-board', 'parent' => 'about']);
```

Referring to Items
------------------

[](#referring-to-items)

You can access defined items throughout your code using the methods described below.

#### Get Item By Name

[](#get-item-by-name)

```
$menu = \Menu::create('menu');
$menu->addItem('contact', 'Contact', '/contact');

// via the getItem method:
$menu->getItem('contact');

// or via magic property accessor:
$menu->contact;
```

You can also store the item variable for further reference:

```
$about = $menu->addItem('about', 'About', '/about');
$about->addSubItem('who-we-are', 'Who We Are', '/about/who-we-are');
$about->addSubItem('what-we-do', 'What We Do', '/about/what-we-do');
```

#### Get All Items

[](#get-all-items)

Menus have an `items` property that is a collection of menu `Item` objects.

```
$menu->items; // ItemCollection
// or:
\Menu::get('MyNavBar')->items;
```

`ItemCollection` is a slightly extended [Laravel Collection](https://laravel.com/docs/master/collections).

#### Get Sub-Items of the Item

[](#get-sub-items-of-the-item)

Get the item using the methods described above then call `children()` on it.

To get children of `About` item:

```
$aboutSubs = $menu->about->children();

// or outside of the builder context
$aboutSubs = Menu::get('MyNavBar')->about->children();

// Or
$aboutSubs = Menu::get('MyNavBar')->getItem('about')->children();
```

`children()` also returns an `ItemCollection`.

To check if an item has any children or not, you can use `hasChildren()`

```
if( $menu->about->hasChildren() ) {
    // Do something
}

// or outside of the builder context
Menu::get('MyNavBar')->about->hasChildren();

// Or
Menu::get('MyNavBar')->getItem('about')->hasChildren();
```

#### Magic Where Methods

[](#magic-where-methods)

You can also search the items collection by magic where methods. These methods are consisted of a `where` concatenated with a property (object property or even meta data)

For example to get items with a specific meta data:

```
$menu->addItem('Home',     '#')->data('color', 'red');
$menu->addItem('About',    '#')->data('color', 'blue');
$menu->addItem('Services', '#')->data('color', 'red');
$menu->addItem('Contact',  '#')->data('color', 'green');

// Fetch all the items with color set to red:
$reds = $menu->whereColor('red');
```

This method returns an `ItemCollection`.

Referring to Menu Instances
---------------------------

[](#referring-to-menu-instances)

You might encounter situations when you need to refer to menu instances out of the builder context.

To get a specific menu by name:

```
$menu = Menu::get('MyNavBar');
```

Or to get all menus instances:

```
$menus = Menu::all();
```

It returns a *Laravel Collection*

HTML Attributes
---------------

[](#html-attributes)

Since all menu items would be rendered as HTML entities like list items or divs, you can define as many HTML attributes as you need for each item:

```
$menu = Menu::create('MyNavBar');

// As you see, you need to pass the second parameter as an associative array:
$menu->addItem('home', 'Home',  ['route' => 'home.page', 'class' => 'navbar navbar-home', 'id' => 'home']);
$menu->addItem('about', 'About', ['route' => 'page.about', 'class' => 'navbar navbar-about dropdown']);
$menu->addItem('services', 'Services', ['action' => 'ServicesController@index']);
$menu->addItem('contact', 'Contact',  'contact');
```

If you render it with the `ul` renderer, the result will be something like this:

```

  Home
  About
  Services
  Contact

```

It is also possible to set or get HTML attributes after the item has been defined using `attr()` method.

- If you call `attr()` with one argument, it will return the attribute value for you.
- If you call it with two arguments, It will consider the first and second parameters as a key/value pair and sets the attribute.
- You can also pass an associative array of attributes if you need to add a group of HTML attributes in one step
- Lastly if you call it without any arguments it will return all the attributes as an array.

```
$menu->addItem('about', 'About', ['url' => 'about', 'class' => 'about-item']);

echo $menu->about->attr('class');  // output:  about-item

$menu->about->attr('class', 'another-class');
echo $menu->about->attr('class');  // output: another-class

$menu->about->attr(['class' => 'yet-another', 'id' => 'about']);

echo $menu->about->attr('class');  // output:  yet-another
echo $menu->about->attr('id');  // output:  about

print_r($menu->about->attr());

/* Output
Array
(
    [class] => yet-another
    [id] => about
)
*/
```

You can use `attr` on an ItemCollection, if you need to target a group of items:

```
$menu->addItem('About', 'about');

$menu->about->addSubItem('whoweare', 'Who we are', 'about/whoweare');
$menu->about->addSubItem('whatwedo', 'What we do', 'about/whatwedo');

// add a class to children of About
$menu->about->children()->attr('class', 'about-item');
```

Manipulating Links
------------------

[](#manipulating-links)

All the HTML attributes will go to the wrapping tags(li, div, etc); You might encounter situations when you need to add some HTML attributes to `` tags as well.

Each `Item` instance has an attribute which stores an instance of `Link` object. This object is provided for you to manipulate `` tags.

Just like each item, `Link` also has an `attr()` method which functions exactly like item's:

```
$menu = Menu::create('MyNavBar');

$about = $menu->addItem('About', ['route' => 'page.about', 'class' => 'navbar navbar-about dropdown']);

$about->link->attr('data-toggle', 'dropdown');
```

#### Link's Href Property

[](#links-href-property)

If you don't want to use the routing feature or you don't want the builder to prefix your URL with anything (your host address for example), you can explicitly set your link's href property:

```
$menu->addItem('about', 'About')->link->href('#');
```

Active Item
-----------

[](#active-item)

You can mark an item as activated using `activate()` on that item:

```
$menu->addItem('home', 'Home', '/')->activate();
/* Output
Home
*/
```

You can also add class `active` to the anchor element instead of the wrapping element (`div` or `li`):

```
$menu->addItem('home', 'Home', '/')->link->active();

/* Output
Home
*/
```

The Menu component automatically activates the corresponding item based on the current **URI** the time you register the item.

You can disable auto activation or choose the element to be activated (item or the link):

```
// To prevent from auto activation
Menu::create('nav', [
    'auto_activate' => false
]);
// To set the active element:
Menu::create('nav', [
    'active_element' => 'link'    // item|link - item by default
]);
```

#### URL Wildcards

[](#url-wildcards)

Konekt Menu component makes you able to define a pattern for a certain item, if the automatic activation can't help:

```
$menu->addItem('articles', 'Articles', '/articles')->activateOnUrls('articles/*');
```

So `articles`, `articles/random-news-title` will both activate the `Articles` item.

### Check for Active Children

[](#check-for-active-children)

You can check if a menu item has an active sub item by calling:

```
$item->hasActiveChild();
// (bool) false
```

You can get the active item(s) from an item colletion by applying the `actives()` filter on them:

```
$menu->roots()->actives();
// Konekt\Menu\ItemCollection

// or:

$item->children()->actives();
// Konekt\Menu\ItemCollection
```

Append and Prepend
------------------

[](#append-and-prepend)

You can `append` or `prepend` HTML or plain-text to each item's title after it is defined:

```