# Main navigation
### Basic configuration
Enable or disable the **Home link** in your catalogue settings. A tutorial on configuring the Home link can be found [here](https://themedocs.zenit.design/en/faq/general/home-link).
For visual reasons, the **Home-Link active status (1)** can also be disabled and optionally replaced with a **Home icon (2)**.
Example:
Home-Link active status
Home icon
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.
{% hint style="success" %}
The “**Subnavigation appearance**” setting for choosing between a dropdown or flyout menu can also be found in the custom fields of each category. This allows you to define the menu type per category and flexibly combine both styles within the main navigation. [Read more](https://themedocs.zenit.design/en/content/category/subnavigation)
{% endhint %}
Example:
With the option **Display service navigation mobile (8)**, the service navigation can be displayed in the mobile offcanvas menu.
Example:
### Border top
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:
### Menu items
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 (2)** displays the familiar "External Link" icon for categories of type "Link" when it is checked by ["Open in new tab"](https://docs.shopware.com/en/shopware-6-en/catalogs/categories?category=shopware-6-en/catalogs#general). 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:
### Category icons
> 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:
