# Multi menu settings in the Design tab

URL: https://www.panoramr.com/help/design-top-nav-bar-multi-menu
Category: Design and branding
Keywords: multi menu, menu bar, top menu, website menu, hamburger menu, flyout
Last checked: 2026-11-01

Every setting of the Top nav bar - multi menu panel in the Design tab: where it is, what it starts as, what it does and what visitors see.

The multi menu is a website-style menu across the top of the tour: items in a bar, a dropdown under each, a flyout beside a dropdown row, and on a phone a hamburger button that opens a slide-in panel. This page lists every setting of the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu) in the **Design** tab, in the order the panel shows them. To choose which bars a tour has, start with [Customize the player's bars, sidebar and gallery](https://www.panoramr.com/help/customizing-the-ui-top-navigation-bottom-bar-and-sidebars).

**Who can use it.** The owner and, by default, an Admin collaborator can open the Design tab; it is not open to Editors or Viewers. Every plan has the bar. In the **Basic** view the panel shows **Show menu bar**, the menu, the phone switch, the look and the style of the items, the room title, the logo and the icons; the **Advanced** view adds the rest. The bar works in the current player (engine v2) only. A tour on a Free plan that wears a Pro theme and has never been hosted shows visitors the free Default look, but the switches of the multi menu stay as you set them: see [What visitors get](https://www.panoramr.com/help/customizing-the-ui-top-navigation-bottom-bar-and-sidebars#what-visitors-get).

**When visitors get a change.** The preview beside the panels shows a look change at once and reloads a menu change after a short pause. Visitors get it after you click **Save & Render**, or after **Publish changes** when the tour uses Draft Workflows ([My changes do not show for visitors](https://www.panoramr.com/help/when-do-changes-show)).

## Turn the bar on

### Show menu bar

The switch at the top of the panel puts the menu across the top of the tour. It starts off.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), the switch at the top. Basic and Advanced view.
**Default:** `off`
**What it does:** Adds the bar. A bar made from the tour's groups and panoramas (the automatic menu) needs at least one panorama; a custom menu needs at least one item. A theme can switch the bar on for a tour that has it off, but never switches it off.
**What visitors see:** A bar across the top with the menu, and the panorama starting below it. With the switch off, no bar.
**Related:** **Show on phones**, [Top nav bar - dropdown](https://www.panoramr.com/help/design-top-nav-bar-dropdown).

## What the menu lists

These settings are on the **Menu** tab.

### Menu content

Choose whether the bar builds its menu by itself or shows a menu you built.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Menu content** > **Automatic** or **Custom**. Basic and Advanced view.
**Default:** **Automatic** (`auto`)
**What it does:** **Automatic** makes the menu from the tour's groups and panoramas each time the tour is put together: a menu for each group with its panoramas, a group of one panorama as a plain link, panoramas in no group under a last menu, and a single menu named `Rooms` for a tour with no groups. With parent groups (**Part of** on the **Settings** tab) and no **Top items**, each group that is part of none is a menu, holding the groups that are part of it. **Custom** shows the menu you built in the menu builder and does not follow the tour. Going back to **Automatic** keeps the custom menu saved for the next time. A tour saved before this choice existed is **Custom** if it has a menu and **Automatic** if not.
**What visitors see:** The bar with that menu. In **Automatic**, a panorama or group you add later is in the bar the next time the page is made (with Draft Workflows, once published).
**Related:** **Customise menu**, **Top items**.

### Customise menu

Opens the menu builder, to build your own menu.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Menu content** > **Customise menu** (it reads **Build menu** or **Edit menu** once the menu is **Custom**). Basic and Advanced view.
**Default:** none; the menu starts empty and **Menu content** is **Automatic** (`none`)
**What it does:** **Customise menu** switches to **Custom** and opens the **Menu builder** on the menu you built before, or on a copy of the automatic menu as it is now. In the builder you drag a panorama onto a row or click it to add it, rename a row without renaming the panorama, and move rows up and down and in and out with buttons. **Add menu** adds a label that only opens a submenu, **Add link** adds a link to a web page, **Fill from categories** makes a menu per group, and **Collapse all** (then **Expand all**) folds the tree. A menu you build is at most three levels deep (the bar, a dropdown, a flyout) and 150 items, so a copy of a bigger tour's automatic menu keeps its first 150; the automatic menu itself holds every group and panorama.
**What visitors see:** The menu as you built it. A link may go to an `http`, `https`, `mailto`, `tel` or relative address; any other kind is blanked. An item that leads nowhere (no panorama, no link, nothing inside) and a panorama that is gone are left out.
**Needs:** **Menu content** set to **Custom**.
**Related:** **Menu content**.

### Top items

Gives the automatic menu a top level of your own, with the groups ticked under each item.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Menu content** > **Top items** (a fold under the card). Basic and Advanced view, in **Automatic** only.
**Default:** none (`none`)
**What it does:** You name items for the bar and tick the groups that belong under each; the bar then shows your items, each with its groups inside and their panoramas. A group ticked nowhere, and the panoramas in no group, go under a last item. With no items of your own, a tour whose groups have parent groups (Settings, **Panorama Groups**, **Part of**) uses its groups: one item for each group that is part of none, holding the groups that are part of it, and the summary says, for example, `8 from your groups`. A second tick beside a group, "Not grouped", puts that group's panoramas straight in the item, without the group's heading. A group may be ticked under more than one item, and you can type each item's name in the tour's other languages. An item with no name, or whose groups the tour no longer has, is left out; the panel says so. Up to 20 items.
**What visitors see:** Your items in the bar, in your order, with the groups as menus inside them.
**Needs:** **Menu content** set to **Automatic**; groups set up on the tour's panoramas.
**Related:** **A menu opens**.

## When an item is pressed

### A menu opens

Choose whether a top item opens a dropdown or the side menu.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **When an item is pressed** > **A menu opens**. Basic and Advanced view, in **Automatic** only.
**Default:** **Its dropdown** (`dropdown`)
**What it does:** **Its dropdown** opens a list under the item, as on a website. **The side list** opens the **Side nav – list menu** on that item's groups and panoramas instead; the bar is then the top level and the side menu the second. It only works while the side menu is on: the panel says so in yellow when it is off, and the bar uses its dropdowns.
**What visitors see:** A press, Enter, Space or Down on an item shows its panoramas in the side list; hovering opens nothing. The view does not move until a panorama is picked. On a phone the bar keeps its own menu, and the narrowed side list starts with an `All` row that lists the top items.
**Needs:** **Side nav – list menu** on, and **Menu content** set to **Automatic**.

### Open menus on

Choose whether the menus open when the pointer rests on them or when it is clicked.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **When an item is pressed** > **Open menus on**. Advanced view.
**Default:** **Hover** (`hover`)
**What it does:** **Hover** or **Click**. Touch screens always tap whichever you choose.
**What visitors see:** With **Hover** a menu opens a moment after the pointer arrives and closes shortly after it leaves. With **Click** it opens on a click. On a touch screen the first tap opens a menu and a second tap on an item with a page of its own goes there. The keyboard works either way: Left and Right along the bar, Down and Up in a menu, Escape closes one level.

## A call-to-action button

### Button label

The words on a button at the end of the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Call-to-action button** > **Button label**. Advanced view.
**Default:** `none` (none)
**What it does:** Up to 60 characters, for example `Enquire Now`. The button needs both a label and a link.
**What visitors see:** A button with those words at the end of the bar, in the bar's highlight color.
**Needs:** **Button link**.
**Related:** **Button link**.

### Button link

Where the button at the end of the bar goes.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Call-to-action button** > **Button link**. Advanced view.
**Default:** `none` (none)
**What it does:** A web address, for example `https://example.com/contact`. Only `http`, `https`, `mailto`, `tel` and relative addresses are kept.
**What visitors see:** A press on the button opens that address.
**Needs:** **Button label**.
**Related:** **Button label**.

## Phones

### Show on phones

Chooses whether a phone gets the multi menu.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Menu** tab > card **Phones** > **Show on phones**. Basic and Advanced view.
**Default:** `on`
**What it does:** On a screen 768 pixels wide or narrower, the bar is a strip with the logo, the icons and a hamburger button that opens a panel you drill down through, one level at a time. Switch it off and a phone has no multi menu: its bars are the ones in **Mobile navigation**.
**What visitors see:** With it on, the strip and the drawer on a phone. With it off, the panorama starts at the top and the phone's own bars take over. When this is the tour's only top bar and **Show title bar** and **Just icons** are both off in the [Top nav bar - dropdown](https://www.panoramr.com/help/design-top-nav-bar-dropdown), the **Top bar features** ticked in **Mobile navigation** make a top bar of their own on the phone.
**Related:** [Mobile navigation and the phone layout](https://www.panoramr.com/help/customizing-the-ui-top-navigation-bottom-bar-and-sidebars#on-a-phone).

## The look of the bar

These settings are on the **Style** tab.

### Look

Chooses the colors of the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Look**. Basic and Advanced view.
**Default:** **Match the tour theme** (`theme`)
**What it does:** **Match the tour theme** takes the bar, its text, its highlight and its dropdowns from the tour's own design, so it follows **Global aesthetics** and every theme. **Light** is a white bar with dark text, **Dark** a dark bar with light text, and **Custom colours** shows the three fields below.
**What visitors see:** The bar in that look. The theme look is as see-through as the tour's glass opacity; the other looks are solid unless you change **Opacity**.
**Related:** [Brand colors](https://www.panoramr.com/help/adding-custom-logos-and-brand-colors-to-the-tour-player).

### Bar colour

The color of the bar in the custom look.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Look** > **Bar colour**. Basic and Advanced view.
**Default:** `#ffffff`
**What it does:** Sets the bar's color. The field shows only while **Look** is **Custom colours**.
**What visitors see:** The bar in that color.
**Needs:** **Look** set to **Custom colours**.

### Text colour (custom look)

The color of the bar's words in the custom look.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Look** > **Text colour**. Basic and Advanced view.
**Default:** `#111827`
**What it does:** Sets the color of the menu's words. The field shows only while **Look** is **Custom colours**.
**What visitors see:** The words in that color.
**Needs:** **Look** set to **Custom colours**.

### Highlight colour

The color of the underline, the item you are on and the button.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Look** > **Highlight colour**. Basic and Advanced view.
**Default:** `#2b547d`
**What it does:** Sets the accent: the line under an item in the **Underline** style, the item the visitor is on, and the call-to-action button. The word on the highlight is chosen to read on it.
**What visitors see:** Those parts in that color.
**Needs:** **Look** set to **Custom colours**.

## How the item you are on is marked

### Button style

Chooses how the bar marks the item the visitor is on.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Button style**. Basic and Advanced view.
**Default:** **Basic** (`basic`)
**What it does:** **Basic** has no line; the item you are on has a soft background. **Underline** draws a line under the item you are on and the one you point at. **Rounded** makes the item you are on a rounded button, set in from the bar's edge, with no lines between items. **Underline** and **Rounded** show their own options under the choice; a color left empty is automatic, and `Use automatic` clears one.
**What visitors see:** The bar marking the current item that way. Where a panorama is in more than one menu, the bar marks one path only: the menu the visitor picked it from, or the first menu that lists it.
**Related:** **Look**.

### Underline Colour

The color of the line under the item you are on.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Underline Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, the line takes the look's highlight color.
**What visitors see:** The line in that color.
**Needs:** **Button style** set to **Underline**.

### Text Colour (Underline)

The color of the word of the item you are on and the one you point at.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Text Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, the word takes the look's highlight color.
**What visitors see:** The two words in that color.
**Needs:** **Button style** set to **Underline**.

### Hover Colour (Underline)

The background behind the item you point at.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Hover Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, a soft tint. A word that would not read on the color you choose is changed unless you choose the word's color too.
**What visitors see:** The item under the pointer on that background.
**Needs:** **Button style** set to **Underline**.

### Line thickness

How thick the line under the item is.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Line thickness**. Basic and Advanced view.
**Default:** `3` pixels
**What it does:** A slider from 1 to 8 pixels.
**What visitors see:** A thinner or heavier line.
**Needs:** **Button style** set to **Underline**.

### Background Colour

The color of the rounded button.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Background Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, the button is light: white on a bar with dark text, and the text's color on a bar with light text.
**What visitors see:** The item you are on as a button of that color.
**Needs:** **Button style** set to **Rounded**.

### Text Colour (Rounded)

The color of the word on the rounded button.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Text Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, whichever color reads on the button.
**What visitors see:** The word in that color.
**Needs:** **Button style** set to **Rounded**.

### Hover Colour (Rounded)

The background behind the item you point at.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Hover Colour**. Basic and Advanced view.
**Default:** none, automatic (`none`)
**What it does:** Left empty, a soft tint.
**What visitors see:** The item under the pointer on that background.
**Needs:** **Button style** set to **Rounded**.

### Corner radius

How round the corners of the button are.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Corner radius**. Basic and Advanced view.
**Default:** `10` pixels
**What it does:** A slider from 3 to 10 pixels.
**What visitors see:** A squarer or rounder button.
**Needs:** **Button style** set to **Rounded**.

### Uppercase labels

Sets the bar's words in capitals.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Uppercase labels**. Advanced view.
**Default:** `on`
**What it does:** Shows the labels of the bar in capitals. The room title follows it.
**What visitors see:** `ROOMS` instead of `Rooms`.

### Lines between items

Draws a thin line between the items of the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Items** > **Lines between items**. Advanced view.
**Default:** `on`
**What it does:** The switch is hidden while **Button style** is **Rounded**, which has no lines.
**What visitors see:** Thin lines between the items.

## Size and position of the bar

These settings are on the **Style** tab, in the cards **Bar** and **Dropdowns**. The cards are in the **Advanced** view only.

### Opacity

How much of the bar's color shows.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Bar** > **Opacity**. Advanced view.
**Default:** none; the look's own (`none`), which the panel shows as `60% (theme)` for the theme look
**What it does:** A slider from 0 to 100 percent in steps of 5. Lower it to see the panorama through the bar. The theme look follows the glass opacity of **Global aesthetics** until you move the slider; **Reset** goes back to the look's own. A bar below 100 percent always has the panorama behind it. The dropdowns use the look's solid color, and the phone's menu panel keeps at least 85 percent so it stays readable.
**What visitors see:** The bar more or less see-through.
**Related:** **Panorama under the bar**.

### Height

How tall the bar is.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Bar** > **Height**. Advanced view.
**Default:** `56` pixels
**What it does:** A slider from 44 to 80 pixels in steps of 2.
**What visitors see:** A slimmer or taller bar on a computer. A phone's strip is a fixed 48 pixels.

### Panorama under the bar

Lets the panorama run behind the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Bar** > **Panorama under the bar**. Advanced view.
**Default:** `off`
**What it does:** Off, the panorama starts below the bar. On, it starts at the top of the window and the bar sits over it. A bar you can see through always has it behind.
**What visitors see:** The picture reaching the top edge behind the bar.
**Related:** **Opacity**.

### Glass dropdowns

Makes the dropdown panels translucent and blurred.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Dropdowns** > **Glass dropdowns**. Advanced view.
**Default:** `on`
**What it does:** Gives the dropdowns and flyouts a see-through, blurred background.
**What visitors see:** The picture faintly visible through an open dropdown.

### Dropdown width

The narrowest a dropdown gets.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Style** tab > card **Dropdowns** > **Dropdown width**. Advanced view.
**Default:** `240` pixels
**What it does:** A slider from 200 to 600 pixels in steps of 10. A dropdown grows to fit its longest name, up to 90 percent of the window, so names stay on one line.
**What visitors see:** Dropdowns at least that wide.

## Room title and logo

These settings are on the **Title and logo** tab.

### Show room title

Shows the name of the room on show as plain text in the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Title and logo** tab > card **Room title** > **Show room title**. Basic and Advanced view.
**Default:** `off`
**What it does:** Adds the room's name between the menu and the icons, on one line; a long name ends in dots and the whole name is its tooltip. The name is in the visitor's language.
**What visitors see:** The name of the room, changing as they move. Below 1000 pixels wide on a computer it is the first thing to go when the bar runs out of room. On a phone the name sits in a band under the strip, in the bar's color a little more see-through, so it is not cut to a few letters.
**Related:** **Alignment**.

### Alignment

Where the room title sits in the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Title and logo** tab > card **Room title** > **Alignment**. Basic and Advanced view.
**Default:** **Centre** (`center`)
**What it does:** **Left** puts the name beside the menu, **Right** beside the icons, **Centre** in the free space between. The control shows only while **Show room title** is on.
**What visitors see:** The name at that place. A phone always reads it from the left.
**Needs:** **Show room title** on.

### Logo

Puts a picture at one end of the bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Title and logo** tab > card **Logo**. Basic and Advanced view.
**Default:** none (`none`)
**What it does:** The button **Upload or choose from assets** opens a window with an upload and the images you already have, in two groups: the tour's own and your asset library. A choice is used as it is; nothing is copied. An upload takes PNG, JPG, WebP, SVG or GIF up to 10 MB. **Change logo** picks another and **Remove** clears it. While the bar has no logo of its own it shows the tour logo from **Branding**, when there is one.
**What visitors see:** The picture at the end of the bar, and on a phone in the strip.
**Related:** **Position**.

### Position

Chooses which end of the bar the logo is at.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Title and logo** tab > card **Logo** > **Position**. Advanced view.
**Default:** **Right end** (`right`)
**What it does:** **Left end** or **Right end**. The control shows only while the bar has a logo, its own or the tour's.
**What visitors see:** The logo at that end.
**Needs:** A logo.

## The icons

### Icons in the bar

The icons of the top nav bar - dropdown, shown in this bar.

**Where:** the Top nav bar - multi menu panel (Design tab > Top nav bar – multi menu), **Icons** tab > card **Icons in the bar**. Basic and Advanced view.
**Default:** all off (`{"id":"info","on":false}, {"id":"autorotate","on":false}, {"id":"vr","on":false}, {"id":"accessibility","on":false}, {"id":"floorplan","on":false}, {"id":"map","on":false}, {"id":"fullscreen","on":false}, {"id":"lang","on":false}, {"id":"listRooms","on":false}, {"id":"gallery","on":false}`)
**What it does:** A row for each icon: **Room Info**, **Autorotate**, **VR Mode**, **Accessibility Mode**, **Floor Plan**, **Map**, **Fullscreen**, **Language Switcher**, **List All Rooms** and **Room Pictures**. The order of the rows is the order in the bar; a switch turns each on. To use these in place of the [Top nav bar - dropdown](https://www.panoramr.com/help/design-top-nav-bar-dropdown), turn off **Show title bar** and **Just icons** there; otherwise the tour has both.
**What visitors see:** Round buttons after the room title (or the menu) and before the call-to-action button and the logo. On a phone the bar's copies are hidden and the same row is at the foot of the menu panel. **Floor Plan** shows only when the tour has a floor plan, **Map** when a panorama has a position, **Language Switcher** when the tour has more than one language, and **Room Info** when the room has a description. **Fullscreen** is left out in a browser that cannot do it.
**Related:** [Icon bar](https://www.panoramr.com/help/design-icon-bar), [Top nav bar - dropdown](https://www.panoramr.com/help/design-top-nav-bar-dropdown).

## A setting with no control

### Accent line under items

The old switch for the line under items.

**Where:** Nowhere in the Design tab. The panel's switch for it went on 2026-10-11, when **Button style** replaced it.
**Default:** `on`
**What it does:** A tour saved before **Button style** existed is read by it: on is **Underline**, off is **Basic**. A tour that already used the bar was given the style it had been shown with.
**What visitors see:** Nothing from this setting itself; **Button style** decides.
**Related:** **Button style**.

## Troubleshooting

**There is no multi menu in my tour.** Check **Show menu bar**. A custom menu needs at least one item; an automatic menu needs a panorama. On a phone, check **Show on phones**.

**I added a panorama and the bar does not have it.** The menu is **Custom**. Switch **Menu content** to **Automatic**, or add it in the builder.

**An item is missing from my custom menu.** An item that leads nowhere is left out: a link with no address, a panorama that is no longer in the tour, or a menu with nothing inside. The builder shows an amber `!` on a row when something inside it would be left out.

**The side list does not open from the bar.** **A menu opens** needs **Side nav – list menu** on and the menu on **Automatic**; otherwise the bar uses dropdowns.