Add the Navigation Links widget to your site to generate an all-inclusive navigation menu with links to all pages on the site, or build your own menu with only the most useful links. Well-structured navigation guides your site visitors and helps them quickly locate the information they are looking for.
To add the widget, follow these steps below:
- Click on Widgets from the left-hand menu within your Website Editor
- Click and drag the Navigation Links widget into your site
To access the content editor of the Navigation Widget:
- Right-click the widget, and click Edit Content. Select one of the following:
- Site pages. Populate the content of the navigation links with site pages, navigation folders, and anchors. This menu will be generated automatically based on the site pages. This is a quick way to place basic navigation on your site. To edit the pages on your site, click Go to Pages.
- Custom links. Build your own menu with custom links. This option allows great flexibility in creating quick navigation bars for inner page navigation, footer navigation with only the most useful links, a menu for social accounts, and more.
- If you select to create navigation with Custom links, the editor will prompt you to populate the list of links with custom elements. Add folders and items to link them to external pages, internal pages, and anchors.
To access the design editor of the Navigation Widget:
- Right-click the widget, and click Edit Design.
- On the Layout tab, you have the following options:
- Select an Orientation for the navigation.
- Click the navigation layout to select a layout for your site navigation.
- Click the sub-navigation layout to select a layout for the sub-pages in your navigation.
- On the Pages tab, click All pages. You have the following options:
- Link Style. Configure the background color, space between items, navigation item direction, and select a divider style.
- To navigate between pages without refreshing the entire page, click More design options, and then click the Quick navigation toggle. You must keep this option disabled if you are using custom code in the header that is not shared by all pages on the site.
- Link Text. Configure the font for the link text.
- Link Style. Configure the background color, space between items, navigation item direction, and select a divider style.
- On the Pages tab, click Selected Page & Hover. You have the following options:
- Effect. Select a display effect for the selected page. Some effects including further customizations.
- Link Text. Configure the font for the link text.
- On the Subpages tab, you can customize the sub-navigation style:
- Link Style. Configure the background color, shadow, spacing between items, and divider.
- Link Text. Configure the font for the link text.
For further information or to speak with one of our Support Agents, simply click on the link here and submit your message via the green Help button on the bottom right-hand corner.