Sidebar navigation
Last updated
Was this helpful?
Last updated
Was this helpful?
In addition to the usual colors, the active path (2) can also be colored. The :hover (3) colors are additionally used for the active element.
Background (1) is the general background color of a menu item. Background:active path (4) sets the color for the active item. This makes it easier for the customer to distinguish which area of which level he can navigate deeper. Background:hover (2) marks the active parent element and the mouse-over action of the current menu elements.
In addition to the font display settings, you can also specify a vertical padding (1). The vertical padding (1) determines the height of each menu item. If there are many categories, a value as small as possible should be chosen.
Through the option margin bottom (2) the individual elements can be separated from each other.
The display mode (3) determines the mode of sidebar navigation. In mode Expandable subcategories can be expanded and collapsed without changing/loading the page.
There are various options available for the Collapse icon (4). The icons are displayed as soon as the Display mode is set to Expandable.
Hover animation (5) can display an animated subline on mouse-over and active-state from the second navigation level.
Examples:
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.
Example:
