Adding Items | menu | Spatie SPATIE HTML Menu Generator ====================== spatie.be/open-source [Docs](https://spatie.be/docs) [Menu](https://spatie.be/docs/menu/v1) Basic-usage Adding Items Version v3 v2 v1 Other versions for crawler [v3](https://spatie.be/docs/menu/v3) [v2](https://spatie.be/docs/menu/v2) [v1](https://spatie.be/docs/menu/v1) Adding Items - [ Introduction ](https://spatie.be/docs/menu/v1/introduction) - [ Postcardware ](https://spatie.be/docs/menu/v1/postcardware) - [ Requirements ](https://spatie.be/docs/menu/v1/requirements) - [ Installation and Setup ](https://spatie.be/docs/menu/v1/installation-and-setup) - [ Questions & Issues ](https://spatie.be/docs/menu/v1/questions-and-issues) - [ Changelog ](https://spatie.be/docs/menu/v1/changelog) - [ About Us ](https://spatie.be/docs/menu/v1/about-us) Basic usage ----------- - [ Your First Menu ](https://spatie.be/docs/menu/v1/basic-usage/your-first-menu) - [ Adding Items ](https://spatie.be/docs/menu/v1/basic-usage/adding-items) Items in depth -------------- - [ Active Items ](https://spatie.be/docs/menu/v1/items-in-depth/active-items) - [ Manipulating Items ](https://spatie.be/docs/menu/v1/items-in-depth/manipulating-items) - [ Conditionally Adding Items ](https://spatie.be/docs/menu/v1/items-in-depth/conditionally-adding-items) Controlling the html output --------------------------- - [ Item Attributes ](https://spatie.be/docs/menu/v1/controlling-the-html-output/item-attributes) - [ Parent Attributes ](https://spatie.be/docs/menu/v1/controlling-the-html-output/parent-attributes) - [ Appending and Prepending Html ](https://spatie.be/docs/menu/v1/controlling-the-html-output/appending-and-prepending-html) Menus in your Laravel app ------------------------- - [ Convenience Methods ](https://spatie.be/docs/menu/v1/menus-in-your-laravel-app/convenience-methods) - [ Conditional Items Based on Permissions ](https://spatie.be/docs/menu/v1/menus-in-your-laravel-app/conditional-items-based-on-permissions) - [ Using Macros ](https://spatie.be/docs/menu/v1/menus-in-your-laravel-app/using-macros) Examples -------- - [ Bootstrap Menu ](https://spatie.be/docs/menu/v1/examples/bootstrap-menu) API --- - [ Menu ](https://spatie.be/docs/menu/v1/api/menu) - [ Link ](https://spatie.be/docs/menu/v1/api/link) - [ Html ](https://spatie.be/docs/menu/v1/api/html) You are viewing the documentation for **an older version** of this package. You can check the version you are using with the following command: ` composer show spatie/menu ` Adding Items ============ ### On this page 1. [ Links ](#content-links) 2. [ Raw Html ](#content-raw-html) 3. [ Submenus ](#content-submenus) Links ----------------------------------------------------------------------- `Spatie\Menu\Link` Links are created with the `to` factory method, which requires a url and a string of text (or html) as parameters. There's also a convenience method on the `Menu` class. ``` Menu::new()->add(Link::to('/', 'Home')); ``` ``` Menu::new()->link('/', 'Home'); ``` ``` Home ``` When using convenience methods to add items, you can't simultanuously add classes or attributes to the item since there isn't an instance variable. Links also have a `prefix` method, or they can be prefixed in bulk per menu. ``` Link::to('foo', 'Foo')->prefix('/items'); ``` ``` Sebastian ``` ``` Menu::new() ->prefixLinks('/items') ->link('foo', 'Foo') ->link('bar', 'Bar'); ``` ``` Foo Bar ``` Raw Html -------------------------------------------------------------------------------- `Spatie\Menu\Html` Raw html chunks can be added as menu items via the `Html` class or convenience method. ``` Menu::new()->add(Html::raw('Hi!')); ``` ``` Menu::new()->html('Hi!'); ``` ``` Hi! ``` Submenus -------------------------------------------------------------------------------- `Spatie\Menu\Menu` Since the `Menu` class itself implements the `Item` interface, menus can be nested. All you need to do is pass a new `Menu` instance to the `add` function: ``` Menu::new() ->link('/', 'Menu') ->add(Menu::new() ->link('/basic-usage/your-first-menu', 'Your First Menu') ->link('/basic-usage/adding-submenus', 'Adding Submenus') ); ``` ``` Menu Your First Menu Adding Submenus ``` You can also use submenus to divide your menu in sections. A header is optional, and can be a plain string or an instance of `item`. The menu parameter can be an instance of `Menu` or a callable which will pass through a new `Menu` as it's first parameter. ``` Menu::new() // No header, `Menu` instance ->submenu(Menu::new() ->link('/introduction', 'Introduction') ->link('/requirements', 'Requirements') ->link('/installation-setup', 'Installation and Setup') }) // String header, `callable` ->submenu('Basic Usage', function (Menu $menu) { $menu ->prefixLinks('/basic-usage') ->link('/your-first-menu', 'Your First Menu') ->link('/working-with-items', 'Working With Items') ->link('/adding-sub-menus', 'Adding Sub Menus'); }); ``` ``` Introduction Requirements Installation and Setup Basic Usage Your First Menu Working With Items Adding Sub Menus ``` If you're using a callable, the new instance will be a blueprint—an empty copy—of the current menu. This means that filters applied to your main menu will also be applied to your submenu. This is useful for cascading `prefixLinks`. ``` Menu::new() ->prefixLinks('/foo') ->submenu(function (Menu $menu) { $menu ->prefixLinks('/bar') ->add('/baz', 'Baz'); }); ``` ``` Baz ``` A good match? ------------- ### What we do best - All things Laravel - Custom frontend components - Building APIs - AI-powered features - Simplifying things - Clean solutions - Integrating services ### Not our cup of tea - WordPress themes - Cutting corners - Free mockups to win a job - "Just execute the briefing" In short: we'd like to be a **substantial part** of your project. [ Get in touch via email ](mailto:info@spatie.be?subject=A%20good%20match%21&body=Tell%20us%20as%20much%20as%20you%20can%20about%0A-%20your%20online%20project%0A-%20your%20planning%0A-%20your%20budget%0A-%20%E2%80%A6%0A%0AAnything%20that%20helps%20us%20to%20start%20straightforward%21)