> For the complete documentation index, see [llms.txt](https://doku.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://doku.themeware.design/handbuch/footer/oberer-bereich/konfiguration.md).

# Konfiguration

## Basiskonfiguration

***

### Größenmodus

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Container-Max-Width (Full-width Boxed)\
• 100% (Full-width)

**Beispiel Wert**:\
`100% (Full-width)`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-width-columns-top`

{% hint style="info" %}
Wähle den Größenmodus des Footers aus.
{% endhint %}

***

### Außenabstand unten @Tablet/Desktop (≥768px)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`0`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-upper-section-margin-bottom`

***

### Innenabstand oben @Tablet/Desktop (≥768px)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`20`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-padding-top`

***

### Innenabstand rechts @Tablet/Desktop (≥768px)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`1`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-padding-right`

***

### Innenabstand unten @Tablet/Desktop (≥768px)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`1`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-padding-bottom`

***

### Innenabstand links @Tablet/Desktop (≥768px)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`1`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-padding-left`

***

### Spalten ausrichten

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• zentriert ausrichten\
• space-between\
• space-around

**Beispiel Wert**:\
`space-around`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Basiskonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-justify-content`

{% hint style="info" %}
Wähle die gewünschte horizontale Ausrichtung aus.

**links**\
Elemente werden am Anfang des Containers positioniert.

**rechts**\
Elemente werden am Ende des Containers positioniert.

**zentriert**\
Die Elemente befinden sich in der Mitte des Containers.

**space-between**\
Elemente werden gleichmäßig verteilt. Das erste Element an den Start, das letzte an das Ende.

**space-around**\
Elemente werden gleichmäßig verteilt. Alle Elemente haben gleiche Abstände um sie herum.
{% endhint %}

## Farbkonfiguration

***

### Textfarbe

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`#ffffff`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-column-top-color`

***

### Linkfarbe

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`#ffffff`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-column-top-link-color`

***

### Linkfarbe @hover

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`#eeeeee`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-column-top-link-color-hover`

***

### Hintergrundfarbe

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`$sw-color-brand-primary`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-columns-top-background-color`

***

### Textfarbe (Headline)

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`#ffffff`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-column-top-headline-color`

***

### Rahmenfarbe (Headline)

**Feldtyp**:\
Farbauswahl

**Beispiel Wert**:\
`#ffffff`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Farbkonfiguration"

**Technischer Name**:\
`twt-footer-column-top-headline-border-color`

## Hintergrundbild

***

### Hintergrundbild anzeigen

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• nicht anzeigen\
• anzeigen

**Beispiel Wert**:\
`anzeigen`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image-show`

***

### Abmessungen

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Ursprüngliche Abmessungen (auto)\
• Hintergrund vollständig abdecken (cover)\
• Hintergrund vollständig abdecken (contain)

**Beispiel Wert**:\
`Ursprüngliche Abmessungen (auto)`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image-size`

{% hint style="info" %}
**auto**\
Das auto Schlüsselwort skaliert das Hintergrundbild so in die entsprechende Richtung, dass das ursprüngliche Seitenverhältnis beibehalten wird.

**cover**\
Die Größe des Bildes wird so angepasst, dass das Seitenverhältnis beibehalten wird und der gesamte Inhaltsrahmen des Elements ausgefüllt wird.

**contain**\
Das Bild wird so skaliert, dass sein Seitenverhältnis beibehalten wird und es in den Inhaltsrahmen des Elements passt.
{% endhint %}

***

### Position

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Links, Oben\
• Links, Mitte\
• Links, Unten\
• Rechts, Oben\
• Rechts, Mitte\
• Rechts, Unten\
• Mitte, Oben\
• Mitte, Mitte\
• Mitte, Unten

**Beispiel Wert**:\
`Links, Oben`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image-position`

***

### Wiederholung

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Keine Wiederholung (no-repeat)\
• Horizontal und vertikal (repeat)\
• Horizontal (repeat-x)\
• Vertikal (repeat-y)

**Beispiel Wert**:\
`Horizontal und vertikal (repeat)`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image-repeat`

***

### Fixierung

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Hintergrundbild scrollt mit der Seite (scroll)\
• Hintergrundbild bleibt fixier (fixed)

**Beispiel Wert**:\
`Hintergrundbild bleibt fixier (fixed)`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image-attachment`

{% hint style="info" %}
**Scroll**:\
Das Hintergrundbild scrollt zusammen mit Text und Bildern.

**Fixed**:\
Fixiert das Hintergrundbild an einer festen Position im Browserfenster und erweckt beim Scrollen den Anschein, die folgenden Inhalte würden über das Hintergrundbild geschoben.
{% endhint %}

***

### Hintergrundbild

**Feldtyp**:\
Medienauswahl

**Beispiel Wert**:\
\`\`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-upper-section-background-image`

## Typografie

***

### Textausrichtung

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• links ausrichten\
• zentriert ausrichten\
• rechts ausrichten

**Beispiel Wert**:\
`zentriert ausrichten`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Oberer Bereich" => Abschnitt "Typografie"

**Technischer Name**:\
`twt-footer-column-top-text-align`