Your First Menu | menu | Spatie

 SPATIE

  HTML Menu Generator
======================

spatie.be/open-source

  [Docs](https://spatie.be/docs)  [Menu](https://spatie.be/docs/menu/v1)  Basic-usage  Your First Menu

 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)

- [ 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 &amp; 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                                                                                                                                                                                                                                    `

Your First Menu
===============

Let's get things started by building a simple menu with two links. All of the following examples are using classes from the `Spatie\Menu` namespace.

```

    Home
    About

```

Menu's are created via the `new` factory method.

```
$menu = Menu::new();
```

Links are created with the `to` factory method, which requires a url and a string of text (or html) as parameters.

```
$link = Link::to('/', 'Home');
```

A menu can be instantiated with an array of items, or items can be added fluently with the `add` method.

```
// With an array:
$menu = Menu::new([
    Link::to('/', 'Home'),
    Link::to('/about', 'About'),
]);

// Or fluently:
$menu = Menu::new()
    ->add(Link::to('/', 'Home'))
    ->add(Link::to('/about', 'About'));
```

When we render or echo the menu, it will output our intended html string.

```
// Via the `render` method:
echo $menu->render();

// Or just through `__toString`:
echo $menu;
```

```

    Home
    About

```
