Top nav bar - dropdown settings in the Design tab - Help Center

The top nav bar is a bar across the top of the tour with the name of the room on show and, when you want it, a dropdown list of the rooms and a row of round buttons. This page lists every setting of the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown) 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.

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 title bar, Dropdown menu and the Icons tab; the Advanced view adds the rest of the Bar tab and the Style tab. A tour on a Free plan that wears a Pro theme and has never been hosted shows visitors the free Default look, which has this bar on: see What visitors get.

When visitors get a change. The preview beside the panels shows it at once. 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).

Turn the bar on

Show title bar

The switch at the top of the panel puts the bar across the top of the tour. It starts on.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), the switch at the top. Basic and Advanced view. Default: on What it does: Adds the bar, with the room's name and the buttons you chose. With the switch off the bar is gone; the buttons can still float in the corner, see Just icons. What visitors see: A bar across the top with the room's name, which changes as they move from room to room. With the switch off there is no bar. On a screen 768 pixels wide or narrower the bar is the phone's own when the tour has the phone's bars, which the default settings give it: its buttons are then the ones chosen under Top bar features in Mobile navigation. Related: Mobile navigation and the phone layout, Just icons.

The bar

These settings are on the Bar tab.

Width

Choose how wide the bar is and whether it floats or runs edge to edge.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Bar > Width. Advanced view. Default: Full screen, fixed (fixed) What it does: Five choices: Small (33%), Standard (50%), Wide (75%), Full screen (100%) and Full screen, fixed. The first four are a rounded bar that floats below the top edge, as wide as the share named. Full screen (100%) floats too, with a small gap on each side. Full screen, fixed is a strip that is part of the top edge: it has square corners and no gap. What visitors see: The bar at that width, in the middle of the top edge. On a phone the bar and its dropdown are as wide as the screen allows, whatever you chose. Related: Show title bar.

Just icons

Shows the buttons by themselves, floating in the corner, when the bar is off.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Bar > Just icons. Advanced view. Default: on What it does: The switch shows only while Show title bar is off. On, the buttons you ticked on the Icons tab float at the top right of the player, each in its own round glass button, with no bar behind them and no room name. There is no floating Language Switcher. Off, the tour has no top buttons at all. What visitors see: Round buttons at the top right (the left in a right-to-left language). The room's name and the dropdown are not shown, because they belong to the bar. Needs: Show title bar off. Related: Show title bar, Icons in the bar.

These settings are on the Bar tab, in the cards Dropdown and Mega gallery.

Turns the room's name in the bar into a button that opens a list of all the rooms.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Dropdown > Dropdown menu. Basic and Advanced view. Default: on What it does: Adds a small arrow after the name. The switch is hidden while Mega gallery override is on, which takes its place. What visitors see: They click the name, or press Enter, Space or the Down arrow on it, and a list of the rooms opens under the bar. Clicking a room goes to it and closes the list; so does a click anywhere else, or the Escape key. Up, Down, Home and End walk the list. With the switch off the name is plain text. Related: Dropdown thumbnails, Mega gallery override.

Puts a small picture of each room beside its name in the dropdown.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Dropdown > Dropdown thumbnails. Advanced view. Default: on What it does: The switch shows only while Dropdown menu is on and Mega gallery override is off. On, each row has a thumbnail of the room. What visitors see: A picture beside each name. The pictures load after the first room has appeared, so they do not slow it down; until then the row shows a plain dark color. Off, the list is names only. Needs: Dropdown menu on.

Mega gallery override

Replaces the dropdown list with a grid of room thumbnails.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Mega gallery > Mega gallery override. Advanced view. Default: off What it does: The name in the bar opens a panel of room thumbnails with their names instead of a list. Turning it on switches the dropdown list off, whatever Dropdown menu says. What visitors see: A grid of pictures under the bar. They click a picture to go to that room; the panel closes as the list does. Related: Thumbnail size, Thumbnails per row, Dropdown menu.

Thumbnail size

Sets how big the pictures of the mega gallery are.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Mega gallery > Thumbnail size. Advanced view. Default: Medium (medium) What it does: Small, Medium or Large. The control shows only while Mega gallery override is on. What visitors see: Smaller or bigger pictures in the grid. Needs: Mega gallery override on.

Thumbnails per row

Sets how many pictures the mega gallery puts on a row.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Bar tab > card Mega gallery > Thumbnails per row. Advanced view. Default: 4 What it does: Auto-fit, or 3 to 8 thumbnails. The control shows only while Mega gallery override is on. What visitors see: That many pictures across. With Auto-fit the number follows the width of the panel. Needs: Mega gallery override on.

Which buttons the bar has

These settings are on the Icons tab, in the card Icons in the bar. The tab is there in both views. The card has a row for each button: a handle, its picture, its name and a switch. The card's heading says how many are on, for example 3 on.

Icons in the bar

The order of the rows is the order of the buttons. Drag a row, or press the up and down arrows beside it, to move it.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > card Icons in the bar. Basic and Advanced view. Default: info, autorotate, vr, accessibility, floorplan, map, fullscreen, lang, listRooms What it does: Sets the order of the buttons. An icon has one name in every bar. A row that is switched off keeps its place in the list. What visitors see: The buttons that are on, in that order, at the right end of the bar after the room's name. The name and its dropdown are always first. Related: Icon lists of the other bars, Show title bar.

Autorotate

Turns the tour's slow spin on and off.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Autorotate. Basic and Advanced view. Default: on What it does: Adds a play and pause button with the tooltip Toggle Autorotate. It shows pause while the tour is turning by itself and play while it is still. What visitors see: A press starts or stops the turning. Dragging the picture stops it. The button shows the state the tour starts in, which depends on the tour's autorotate setting and on a visitor who has asked their device for less motion. Related: Show title bar.

Accessibility Mode

Opens the text version of the tour.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Accessibility Mode. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip Accessibility Linear View. It needs a second condition: see the Accessibility button switch below. What visitors see: A press opens the plain, linear version of the tour that Panoramr makes for it. A downloaded copy of the tour has no such button, because that page is made by the server. Needs: The Accessibility button switch below not switched off.

Room Info

Opens the text and media of the room.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Room Info. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip Information that opens the Media Window on its overview. What visitors see: A press opens the room's text and media. In a room that has none, and when the tour has no media of its own, the button is hidden. Related: Info and media panel.

Floor Plan

Opens the tour's floor plan.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Floor Plan. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip View Floorplan. What visitors see: A press opens the floor plan. A tour with no floor plan shows no button. Needs: A floor plan on the tour.

Map

Opens a map of the rooms.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Map. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip View Map. What visitors see: A press opens a map with a pin for each room that has a position. If no room has a position the button is not shown. Needs: At least one panorama with a position.

VR Mode

Lets a visitor with a headset enter VR.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > VR Mode. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip Enter VR. What visitors see: A press asks the browser to enter VR. What happens next depends on the visitor's device and browser; it was not tried against a headset for this page.

Fullscreen

Makes the tour fill the screen.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Fullscreen. Basic and Advanced view. Default: on What it does: Adds a button with the tooltip Toggle Fullscreen. It needs a second condition: see the Fullscreen button switch below. What visitors see: A press fills the screen and the icon changes to its shrink form; a second press goes back. A browser that cannot go full screen on the page does nothing. Needs: The Fullscreen button switch below not switched off.

Language Switcher

Lets a visitor change the language of the tour.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > Language Switcher. Basic and Advanced view. Default: on What it does: Adds a globe button with the tooltip Change Language. It lists the languages the tour has. What visitors see: A globe that opens a list of languages. A tour with one language shows no globe. Needs: A tour in more than one language.

List All Rooms

Opens the list of all rooms in the Media Window.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Icons tab > Icons in the bar > List All Rooms. Basic and Advanced view. Default: off What it does: Adds a button with the tooltip View All Rooms. The same icon on any bar gives the Media Window its Room list tab. What visitors see: A press opens the list of rooms, from which a click goes to a room. Related: Info and media panel.

Colors and type of the bar

These settings are on the Style tab. The tab is in the Advanced view only.

Use your own colours

Colors and types the bar apart from the rest of the player.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Use your own colours. Advanced view. Default: off What it does: While it is off the bar wears the colors, the type and the glass effect of Global aesthetics. Switching it on shows the fields below. What visitors see: With it on, the bar and its buttons in the fields' colors, font and size; with it off, the tour's global look. Related: Brand colors.

Global Typography Font

The typeface of the bar's words.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Global Typography Font. Advanced view. Default: default What it does: Sets the font of the room's name, the dropdown and the mega gallery. It counts only while Use your own colours is on. A font that is not the default is loaded with the page. What visitors see: The bar's words in that font. With the default, the tour's own font. Needs: Use your own colours on.

Base Font Size

The size of the bar's words.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Base Font Size. Advanced view. Default: 16 pixels What it does: A slider from 12 to 24 pixels. It counts only while Use your own colours is on. What visitors see: The bar's text at that size. Needs: Use your own colours on.

Interface Text Color

The color of the bar's words.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Interface Text Color. Advanced view. Default: #ffffff What it does: Sets the color of the room's name and of the lists under it. It counts only while Use your own colours is on. What visitors see: The words in that color. Needs: Use your own colours on.

Interface Icon Color

The color of the buttons' pictures.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Interface Icon Color. Advanced view. Default: #ffffff What it does: Sets the color of every icon in the bar. It counts only while Use your own colours is on. What visitors see: The icons in that color. Needs: Use your own colours on.

Primary UI Color

The color of the bar itself.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Primary UI Color. Advanced view. Default: #07077d What it does: Sets the bar's color, and the dropdown's. The bar is drawn with the glass opacity of Global aesthetics, so the picture shows through. It counts only while Use your own colours is on. What visitors see: The bar in that color. Needs: Use your own colours on. Related: Global aesthetics.

Hover Brightness

How much a button lightens under the pointer.

Where: the Top nav bar - dropdown panel (Design tab > Top nav bar – dropdown), Style tab > Hover Brightness. Advanced view. Default: 25 percent What it does: A slider from 0 to 100. It sets how much white is laid over a button, or over the room's name, while the pointer is on it. It counts only while Use your own colours is on. What visitors see: The item lighter by that share when the pointer is over it. Needs: Use your own colours on.

Settings with no control

Fullscreen button

A second switch behind the Fullscreen icon that no panel shows.

Where: Nowhere in the Design tab. Default: on What it does: The Fullscreen button is in the bar only when this is on and Fullscreen is on. A theme or an old tour that saved it as off hides the button whatever the panel says. What visitors see: Nothing different while it is on. When it is off the bar has no Fullscreen button. Related: Fullscreen.

Accessibility button

A second switch behind the Accessibility icon that no panel shows.

Where: Nowhere in the Design tab. Default: on What it does: The Accessibility button is in the bar only when this is on and Accessibility Mode is on. A downloaded copy of a tour always has it off, because the text version is made by the server. What visitors see: Nothing different while it is on. When it is off the bar has no Accessibility button. Related: Accessibility Mode.

Troubleshooting

There is no top bar in my tour. Check Show title bar. On a screen 768 pixels wide or narrower the top bar is the phone's own, set by Mobile navigation. A change that is not saved or published does not reach visitors yet.

The room's name is not a button. Check Dropdown menu, and that Mega gallery override is off if you wanted the list.

A button I switched on is missing. Floor Plan needs a floor plan, Map needs a panorama with a position, Language Switcher needs a tour in more than one language, and Room Info is hidden in a room with no text or media. Fullscreen and Accessibility Mode also need the two switches under "Settings with no control".

Only floating buttons show. Show title bar is off and Just icons is on. Turn the bar on to get the name and the dropdown back.