Pages & Navigation works directly with the Menu element. Every page created in your site, is automatically added to a menu.
To place a menu element on your page, click and drag your desired menu from the elements panel onto the canvas.
When you place a Menu element on the page, it already displays all the pages within that menu. The menu will not display any pages that are set as hidden in the Pages and Navigation settings.
Click and drag your menu to change the size of your tabs. They will grow or shrink based on the size of the element.
All design changes can be done in the Properties Panel.
If you'd like to display a different menu (not the default Top Menu) Choose the menu you would like displayed from the dropdown "Select Menu:"
EDITING THE DESIGN OF YOUR MENU
All design changes should be made in your Properties Panel. The design options are divided into sections:
The font displayed is based on your preset Paragraph Styles. To create a new style click on the settings icon next to the "Font Style" dropdown.
The size and colors of the text can be edited directly in the panel. As well as the weight of the font.
Here you are able to edit the background for your buttons.
You are able to set a background color, as well as add images to the background.
Use the Image Fitting and Image Position dropdowns to edit how the images fit within your menu tabs.
Tabs & Text Alignment
By default, all tabs in your menu will be the same width. If you would like the width to be based on the page name length, uncheck the box below:
To edit the space between tabs use the Margin settings.
To edit the placement of the text and space between the text and the border of your tab use the Text Alignment and Text Padding settings.
If you would like to change the direction of your menu from Left to Right or Right to Left, use the "Menu Direction" setting.
To edit the border color and size, use the following settings.
You can also choose a different color for Hover.
Here you can turn on or off the Icons and Text from your menu.
You are also able to edit the size, position and padding of the icons in the menu.
There are currently 20 animations to choose from. Use the dropdown to select the animation you would like to use, and customize it by color and size.
You can preview your effect directly in the studio by hovering over the menu.