> For the complete documentation index, see [llms.txt](https://wiki.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.themeware.design/wissensdatenbank/einfuehrung/footer-navigation-konfigurieren.md).

# Footer-Navigation konfigurieren

Die Footer-Navigation ist die mehrspaltige Navigation im Footer, z.B. mit den Spalten "Service", "Informationen" oder "Über uns".

Die Navigation selbst legst du in Shopware über Kategorien an und weist sie deinem Verkaufskanal zu. In der ThemeWare® Konfiguration bestimmst du anschließend, an welcher Stelle im Footer sie ausgegeben wird und wie sie aussieht.

## Schritt 1: Kategorien anlegen

1. Öffne die Administration deines Shops
2. Wechsel über die Hauptnavigation in "**Kataloge**" => "**Kategorien**"
3. Lege auf oberster Ebene eine neue Kategorie an, z.B. "Footer"
   * Wähle in der Karte "**Allgemein**" beim "**Kategorietyp**" die Option "**Strukturelement / Einstiegspunkt**"
4. Lege unterhalb dieser Kategorie die **Spalten** an, z.B. "Service", "Informationen", "Über uns"
   * Auch hier ist der Kategorietyp "**Strukturelement / Einstiegspunkt**" sinnvoll
5. Lege unterhalb jeder Spalte die einzelnen **Links** an, z.B. "Kontakt", "Versand und Zahlung", "AGB"
   * Kategorietyp "**Seite / Liste**": eine eigene Seite mit zugewiesenem Layout (Erlebniswelt)
   * Kategorietyp "**Link**": ein Verweis auf ein Produkt, eine Kategorie, eine Landingpage oder eine externe Seite
6. Achte darauf, dass alle Kategorien auf "**Aktiv**" stehen
7. Speicher deine Kategorien

{% hint style="info" %}
**Info**: Die Kategorien der direkt untergeordneten Ebene werden zu Spalten, der Kategoriename wird als Spaltenüberschrift ausgegeben. Alle Kategorien darunter erscheinen als Zeilen innerhalb der Spalte.
{% endhint %}

## Schritt 2: Einstiegspunkt zuweisen

Dafür gibt es zwei Wege, das Ergebnis ist identisch.

#### Weg A: über die Kategorie

1. Öffne die Kategorie "Footer"
2. Öffne die Karte "**Navigation**"
3. Wähle beim "**Einstiegspunkt**" die Option "**Footernavigation**"
4. Wähle bei der "**Verkaufskanalzuweisung**" deinen Verkaufskanal aus
5. Speicher die Kategorie

#### Weg B: über den Verkaufskanal

1. Öffne über die Hauptnavigation deinen Verkaufskanal
2. Wechsel in den Tab "**Allgemein**"
3. Wähle in der Karte "**Navigation**" beim Feld "**Einstiegspunkt für die Footer-Navigation**" deine Kategorie "Footer" aus
4. Speicher den Verkaufskanal

## Schritt 3: Footer-Navigation im Theme platzieren

In ThemeWare® ist die Footer-Navigation ein Widget, das du einem der Footer-Elemente zuweist.

1. Wechsel über die Hauptnavigation in die "**Theme-Verwaltung**" ("Inhalte" => "Themes")
   * **Hinweis**: In der Shopware Cloud findest du den Bereich "Themes" direkt in der Hauptnavigation.
2. Klicke nun auf dein ThemeWare® Theme um die Bearbeitung zu beginnen
3. Wechsel in den Tab "**Footer**"
4. Öffne den Bereich "**Inhalte zuweisen und anordnen**"
5. Wähle in einem freien Abschnitt (z.B. "**Element 1**") beim "**Inhalt (Widget)**" die Option "**Footer Navigation**"
6. Lege den "**Bereich**" (z.B. "Mittlerer Bereich") und die "**Reihenfolge**" fest
7. Speicher die Theme-Konfiguration

## Schritt 4: Darstellung anpassen

* Tab "**Widgets**" => Bereich "**Footer-Navigation**"
* Im Abschnitt "**Basiskonfiguration**" konfigurierst du den "**Listenstil**" und den "**Innenabstand links (Liste mit Elementmarkierung)**"
* Im Abschnitt "**Farbkonfiguration**" die "**Linkfarbe**", die "**Linkfarbe @hover**", die "**Markierungsfarbe (Liste mit Elementmarkierung)**" und die "**Rahmenfarben unten**"
* Im Abschnitt "**Typografie**" die "**Textformatierung**" und ob "**Links unterstreichen**" aktiv ist

Speicher anschließend die Theme-Konfiguration und lade die Storefront einmal neu.

***

## Weiterführende Informationen

* Einführung: [Footer konfigurieren](/wissensdatenbank/einfuehrung/footer-konfigurieren.md)
* Einführung: [Service-Navigation konfigurieren](/wissensdatenbank/einfuehrung/service-navigation-konfigurieren.md)

#### ThemeWare® Video-Tutorial

{% embed url="<https://service.themeware.design/themeware-tutorial>" %}
ThemeWare® Video-Tutorial
{% endembed %}
