Bride Show Dubai is part of the Informa Markets Division of Informa PLC

Informa
Informa

Navigation

The Navigation component allows for the configuration and display of a navigation item on a page.

Examples

Example navigations

 

Authoring

Configure Dialog

The configure dialog allows the content author to define the navigation and how it will behave and appear for a visitor to the page.

Properties Tab

Navigation Properties

  • Navigation Root The root page, which will be used to generate the navigation tree.
  • Exclude navigation root Exclude the navigation root in the resulting tree, include its descendants only.
  • Collect all child pages Collect all pages that are descendants of the navigation root.
  • Navigation Structure Depth Defines how many levels down the navigation tree the component should display relative to the navigation root (only available when Collect all child pages is not selected).

Disable Navigation

To disable navigation to the specified page, simply open its property page and tick Remove Hyperlink from Navigation.

 

 

Mega-menu Navigation

 

AEM now allows you to display your navigation as 'mega-menu'. 

This can be done by going to the page property where you want this enabled and under basic, tick Show as Mega Menu. Save and publish to apply.

Attention! The mega-menu option should be applied to Level 1 pages only, if appled to non-level 1 pages, it will break the navigation.

Below is a gif showing how it's done.

 

 

Icon in Navigation Feature

The value of using icons in navigation is that they can enhance the user experience by making navigation more intuitive and visually appealing. Icons can help users quickly recognize and differentiate between different navigation options, which can make it easier and faster for them to find what they are looking for. This can lead to increased engagement and satisfaction with the interface, as users are able to navigate more seamlessly and efficiently. Additionally, icons can save space and improve accessibility, making navigation more accessible to users with different needs or preferences. By using icons in navigation, companies and organizations can create a more user-friendly and engaging interface that enhances the overall user experience.

You have two options in choosing to enable this feature, one is the icon along with the navigation text or just icon-only. 

  • Open the page properties of the page you want this feature enabled
  • In the Basic tab, under the Navigation Menu Item click on the picker, set the icon of your choice
  • This will display the icon alongside the navigation
  • clicking on the tick box for icon only will replace the whole navigation text with just the icon

See gif below on how this is done and what it looks like.