---
title: "Menus"
slug: "menus"
updated: 2025-09-01T10:12:49Z
published: 2025-09-01T10:12:49Z
---

> ## Documentation Index
> Fetch the complete documentation index at: https://documentation.deltatre.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Menus

In this article, we cover how to manage ‌menu navigation.

---

## Adding a new menu

1. Add a new menu to a folder or a page by selecting *Add menu*:

> [!NOTE]
> **Note:**Choose where to position the menu — either at folder or page level. E.g., add the menu to the folder that can be viewed and edited by allowed users. The menu behavior is the same in both cases.

![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/10663482755740.png)
2. Set the menu name, which can only contain *dashes* or *underscores* but not *spaces,* then select *Create*:

![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/10663454699676.png)
3. Double-check the menu is available in the site structure tree: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/10663505979676.png)

## Creating and editing a menu item

1. Optionally, set the menu *Description*.
2. Add the first menu item by selecting the *Add* button.

![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850949695516.png)
3. Edit the first menu item by setting:
  - Main Properties
    - **Name** (optional): It overwrites the label when displaying the menu item among the other ones.
    - **Label** (mandatory): The menu item's label when shown on the front-end. Select @ to use a variable to value the *Label*.
    - **ID** (mandatory): The menu item's unique identifier across the FORGE Page Builder instance. Once created, FORGE Page Builder automatically assigns the *ID*, but producers can overwrite it.
    - **Custom Properties**(optional): Key/Value pairs, semicolon separated. The front-end implementation uses custom properties to render the menu item. Select @ to use a variable to value the *Custom Properties*.
    - **Link** (optional): Link of the menu item target page. Select @ to use a variable to value the *Page*.
    - **Opens in a New Tab** (toggle): By default, the menu item opens the target page in the same tab.
    - **Visible** (toggle): By default, the menu item is visible on the front-end.
  - Visual Properties
    - **Icon** (optional): The relative link to the menu item icon.
    - **Tooltip** (optional): The menu item tooltip.

![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850965972380.png)

## Adding many menu items

1. Select the *Add* button at the bottom of the page to add other menu items:

![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/10663583688092.png)
2. Hover over the existing menu items to select where to position the new menu item: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850949704860.png)
3. Add as many menu items as you need and structure them as *parents* and *children*. See *Alpha in the World* in the example below: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850965983644.png)

## Adding permissions

1. Select the *Permissions* tab: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850949713820.png)
2. Select *Assign a Group*: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850965992732.png)
3. In the *Select group to add* popup window, select the authorization groups the menu requires to be visible: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850949724572.png)
4. In the bottom-right, select *Add group* to assign all selected groups: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850949731228.png)
5. Double-check added permissions: ![](https://cdn.document360.io/2e698e3c-4773-44a4-9476-1d05bac85eee/Images/Documentation/11850966007196.png)
