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:
With the option Display service navigation mobile (8), the service navigation can be displayed in the mobile offcanvas menu.
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:
from theme version 4.7.0
Via the custom fields under Catalogues > Categories > [Select category] in the tab "Additional" you will find a media field Category Icon for configuring the icon.
You can use the checkbox Icon (1) to activate the display of icons in the main navigation and set the Size (2) of the icons for the respective menu. In the mobile view, the main menu is shown as a mobile off-canvas menu. Here, too, you can use the checkbox Icon mobile (2) to determine whether category icons should be displayed in this menu. In the field Size (4) you enter the size of the image in pixels.
Example: