Navigation Widget

Use the Navigation widget to display website navigation as navigation links. To do this, after you place the Navigation widget on your page, you must perform some configuration steps.
NOTE: Navigation links can link only to visible pages.

###Configure the navigation view

1. Open the Navigation widget designer.

2. To choose which pages to display as links in the navigation, select one of the following options:

   • Top-level pages (and their child-pages if template allows)
     The Navigation widget displays links to pages that are on top level in the pages' hierarchical structure and have no parent.

   • All pages under particular page
     The Navigation widget displays links to pages that are children of just one specific page.

     • Click the Select page button.
     • In the treeview, select the parent page and click Done selecting.

   • All pages under currently opened page
     The Navigation widget displays links to pages that are children of the currently opened page.

   • All sibling pages of currently opened page
     The Navigation widget displays links only to pages that are siblings of the currently opened page.

   • Custom selection of pages…
     The Navigation widget displays links only to specific pages you select.

     • Click the Select pages button.
     • In the treeview, select the checkboxes next to the pages that you want to be part of the navigation.
     • When finished, click Done selecting.

3. For navigation templates that have more than one level of navigation, you can setup the depth of the navigation nodes. To do this, under Levels to include, choose one of the following options:

   • All
     When you select a parent or a group page, the Navigation widget always displays its children pages as well.
   • Number
     The Navigation widget displays the children pages only up to a level of your choice. Choose a level from the Number dropdown menu. For example, if you select 2, the system displays only the top two levels of navigation - the top pages and their immediate children.

4. From the Template dropdown menu, select the template you want to use for displaying navigation:

   • Horizontal
     Links to pages are displayed horizontally (one next to the other).
   • Vertical
     Links to pages are displayed vertically and there is no hierarchy.
   • Tabs
     Links to pages are displayed horizontally. If you select a parent page or a group page, all its child pages are displayed in a tabstrip.
   • Sitemap
     Links to top level pages are displayed horizontally. If a top level page is a parent page or a group page that contains other pages, these pages are displayed in a column below their parent page. Only the first two levels of hierarchy are displayed.

5. To apply responsive design for the Navigation widget only, follow the procedures described in .

6. To apply additional CSS classes to the Navigation widget, under the More options section specify the CSS class names.

###Define advanced properties

To define additional advanced properties of the Navigation widget, in the widget designer, click Advanced properties and define the following:

• CssClass
  If you specified a CSS class in the Simple view of the widget, the value is copied in the Advanced view as well.

• LevelsToInclude
  If you specified any value different that 1 in the Simple view of the widget, it is copied in the Advanced view as well.

• SelectionMode
  This property displays the value that you selected in the Display section in the Simple view of the widget. Possible values are:

  • TopLevelPages
  • CurrentPageChildren
  • CurrentPageSiblings

• ShowParentPage
  The default value is False. If you set this property to True, you can see the parent page in the navigation.

• TemplateName
  Reflects your selection in the Template dropdown menu in the Simple view of the widget.