Main navigation
Last updated
Last updated
Enable or disable the often redundant Home-Link (1) in the menu to save space. You can also decide if the home-link should get an initial active status (2) when visiting the home page of the store.
With the alignment (3) you can align and distribute the menu items horizontally. The separator (4) setting divides the single menu items with a separator.
Choose from 13+ Hover Animation (5) select the appropriate animation for your store.
The Scroller (6) optionally ensures that main navigation categories cannot wrap - no matter how many main categories you want to map. On mobile devices with touch input can be scrolled horizontally, on desktop devices can be reached with the help of arrows (1, 2).
Example:
The option subnavigation appearance (7) provides the ability to replace the standard flyout navigation with a simple dropdown navigation.
Further settings for dropdown navigation can be made in the section Header > Main navigation > Dropdown Navigation
Example:
Optionally, the main navigation can be separated from the upper header area by a border.
With the help of the setting Full width (1) you can stretch the line to the full header width. This way, depending on the basic layout you choose, the line will run to the edge of the browser and will not be limited by the maximum content width of your online shop.
Example:
With the option arrows (1) you can display small arrows next to the categories which will be displayed if a category has subcategories, see example 1.
Extern-link icon (4) displays the familiar "External Link" icon for categories of type "Link" when it is checked by "Open in new tab". This way your visitors will know exactly what happens when they click on such a link, see example 2.
You set the spacings between each category with Padding left/right (3). Should you use a lot of categories, reduce the spacing between your categories.
Example 1:
Example 2:
