# Kategorie Icons

> ab Theme Version 4.7.0

Über die **Zusatzfelder** unter Kataloge > Kategorien > \[Kategorie auswählen] im Tab "Weitere" findest Du ein Medienfeld **Kategorie Icon (1)** zum Hinterlegen des Kategorie Icons.

<figure><img src="https://2797716245-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglpRTGDOwN11YxqfJhAM%2Fuploads%2FyEo4d3rikzXHJt8z1IA2%2Fdocs-de-config-custom-fields-category-icon-media.png?alt=media&#x26;token=29bcf15a-dd37-4162-ab00-ca531a11d3c7" alt=""><figcaption></figcaption></figure>

Verwende hierzu herkömmliche JPG oder PNG Dateien. Noch besser lassen sich aber SVG Dateien z.B. in Form von Icons einbinden und darstellen. In unseren Demos nutzen wir hier beispielsweise einfach die Icons von [Ionicons](https://ionic.io/ionicons) und speichern direkt auf der Seite die SVG-Datei ab.&#x20;

#### Theme-Konfiguration

In der Theme-Konfiguration lassen sich die Icons in jedem Menü in Bezug auf Anzeige und Größe konfigurieren.

* Einstellungen im Tab: Header > Mein Navigation > [Kategorie Icons](https://themedocs.zenit.design/styling/header/main-navigation#kategorie-icons)
* Einstellungen im Tab: Header > Flyout Navigation > [Kategorie Icons](https://themedocs.zenit.design/styling/header/flyout-navigation#kategorie-icons)
* Einstellungen im Tab: Header > Dropdown Navigation > [Kategorie Icons](https://themedocs.zenit.design/styling/header/dropdown-navigation#kategorie-icons)
* Einstellungen im Tab: Elemente > Sidebar Navigation > [Kategorie Icons](https://themedocs.zenit.design/styling/elemente/sidebar-navigation#kategorie-icons)

Beispiele:

<br>

<figure><img src="https://2797716245-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglpRTGDOwN11YxqfJhAM%2Fuploads%2FXR74JiNrg98t0ps9NqWQ%2Fdocs-en-storefront-custom-fields-category-icon-media-mobile-offcanvas.png?alt=media&#x26;token=694bb938-e8f6-4436-a35a-9452be3e6f76" alt="" width="188"><figcaption><p>Kategorie Icons im mobilen Offcanvas Menü</p></figcaption></figure>

<figure><img src="https://2797716245-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglpRTGDOwN11YxqfJhAM%2Fuploads%2FYWAHBcIiU3ZMhx2GnFOE%2Fdocs-en-storefront-custom-fields-category-icon-media-sidebar.png?alt=media&#x26;token=98acc58b-3fb0-460f-ae73-a2de6f5f163d" alt=""><figcaption><p>Kategorie Icons in der Sidebar Navigation</p></figcaption></figure>

<figure><img src="https://2797716245-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FglpRTGDOwN11YxqfJhAM%2Fuploads%2FcaVw2bwRf6CVsM3viQd9%2Fdocs-en-storefront-custom-fields-category-icon-media-flyout.png?alt=media&#x26;token=2fac0964-afa2-44c9-83fa-fdf70d85f179" alt=""><figcaption><p>Icons im Flyout Menü</p></figcaption></figure>