# Konfiguration

## Basiskonfiguration

***

### Außenabstand oben

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`20`

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

**Technischer Name**:\
`twt-footer-margin-top`

{% hint style="info" %}
Lege den Außenabstand nach oben für den Footer fest.

**Hinweis**: Diese Konfiguration gilt nur für Seiten ohne USP-Bar im Footer.
{% endhint %}

***

### Innenabstand oben

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`0`

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

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

***

### Innenabstand unten

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`0`

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

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

***

### Innenabstand links/rechts

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`0`

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

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

## Farbkonfiguration

***

### Hintergrundfarbe

**Feldtyp**:\
Farbauswahl

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

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

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

## Hintergrundbild

***

### Hintergrundbild anzeigen

**Feldtyp**:\
Auswahlfeld

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

**Beispiel Wert**:\
`anzeigen`

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

**Technischer Name**:\
`twt-footer-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 "Layout" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-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 "Layout" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-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 "Layout" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-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 "Layout" => Abschnitt "Hintergrundbild"

**Technischer Name**:\
`twt-footer-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 "Layout" => Abschnitt "Hintergrundbild"

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

## Typografie

***

### Schriftart (Überschriften)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• Text\
• Überschriften

**Beispiel Wert**:\
`Text`

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

**Technischer Name**:\
`twt-footer-column-font-family`

***

### Schriftgröße

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`16`

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

**Technischer Name**:\
`twt-footer-column-font-size`

***

### Schriftgröße (Überschriften)

**Feldtyp**:\
Nummernfeld

**Beispiel Wert**:\
`18`

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

**Technischer Name**:\
`twt-footer-column-headline-font-size`

***

### Strichstärke (Überschriften)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• light\
• normal\
• bold

**Beispiel Wert**:\
`bold`

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

**Technischer Name**:\
`twt-footer-column-headline-font-weight`

***

### Textformatierung (Überschriften)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• keine\
• Großschreibung\
• Kleinschreibung\
• Wortanfang in Großbuchstaben

**Beispiel Wert**:\
`keine`

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

**Technischer Name**:\
`twt-footer-column-headline-text-transform`

***

### Links unterstreichen (Überschriften)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• nein\
• ja

**Beispiel Wert**:\
`nein`

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

**Technischer Name**:\
`twt-footer-column-headline-link-underline`

{% hint style="info" %}
Unterstreiche verlinkte Überschriften, damit klickbare Einträge von nicht-klickbaren strukturellen Seiten klar unterschieden werden und so die Barrierefreiheit verbessert wird.

**Hinweis**: Diese Konfiguration kann durch die Barrierefreiheits-Konfiguration "Links unterstreichen" im Tab "Weiteres" => Bereich "Barrierefreiheit" => Abschnitt "Layout" überschrieben werden.
{% endhint %}

## Spalten

***

### Spaltenanzahl @Tablet (≥768px)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• auto\
• 6 Spalten\
• 4 Spalten\
• 3 Spalten\
• 2 Spalten\
• 1 Spalte

**Beispiel Wert**:\
`4 Spalten`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Layout" => Abschnitt "Spalten"

**Technischer Name**:\
`twt-footer-grid-columns-tablet`

***

### Spaltenanzahl @Desktop (≥1200px)

**Feldtyp**:\
Auswahlfeld

**Verfügbare Werte**:\
• auto\
• 6 Spalten\
• 4 Spalten\
• 3 Spalten\
• 2 Spalten\
• 1 Spalte

**Beispiel Wert**:\
`3 Spalten`

**Pfad zur Einstellung**:\
Tab "Footer" => Bereich "Layout" => Abschnitt "Spalten"

**Technischer Name**:\
`twt-footer-grid-columns`