---
title: Hero-Banner
description: Individuelle Banner-Bilder fuer jede Seite
---

# Hero-Banner

Mit dem Hero-Customizer kannst du fuer jede Seite ein individuelles Banner-Bild mit Titel einstellen.

---

## Wo finde ich die Einstellungen?

1. Gehe zu **Seiten** im WordPress-Admin
2. Bearbeite eine beliebige Seite
3. In der rechten Seitenleiste: **"Hero Einstellungen"**

---

## Verfuegbare Felder

### 1. Hero Hintergrundbild

| Feld | Beschreibung |
|------|--------------|
| **Bild waehlen** | Oeffnet die Mediathek |
| **Entfernen** | Loescht das Bild |

**Tipp:** Bilder im Querformat, mindestens 1920px breit.

**Fallback:** Ohne Hero-Bild wird das Beitragsbild verwendet.

---

### 2. Hero Titel

| Feld | Beschreibung |
|------|--------------|
| **Leer lassen** | Seitentitel wird angezeigt |
| **Text eingeben** | Ueberschreibt den Seitentitel |

---

### 3. Untertitel

Optional - erscheint unterhalb des Titels mit tuerkisem Balken.

---

### 4. Overlay Staerke

Verdunkelt das Bild fuer bessere Lesbarkeit.

| Option | Wert |
|--------|------|
| Kein Overlay | 0% |
| Leicht | 20% |
| **Mittel (Standard)** | 40% |
| Stark | 60% |
| Sehr stark | 80% |

---

### 5. Bildausschnitt (vertikal)

Bestimmt, welcher Teil des Bildes sichtbar ist.

| Option | Zeigt |
|--------|-------|
| Oben (0%) | Oberen Bildrand |
| Oben-Mitte (25%) | Zwischen oben und mitte |
| **Mitte (50%)** | Bildmitte (Standard) |
| Unten-Mitte (75%) | Zwischen mitte und unten |
| Unten (100%) | Unteren Bildrand |
| Benutzerdefiniert | Feineinstellung 0-100% |

**Beispiel:**
- Foto mit Pferd am unteren Bildrand: 75-100%
- Foto mit Himmel oben: 0-25%

---

## Banner-Format

Das Banner wird im **4:1 Format** angezeigt.

| Geraet | Verhaeltnis |
|--------|-------------|
| Desktop | 4:1 (flach) |
| Tablet | 3:1 (etwas hoeher) |
| Mobile | 2.5:1 (noch hoeher) |

---

## Titel-Styling

- **Tuerkiser Balken** als Hintergrund
- **Teko Schriftart**, 48px
- **Grossbuchstaben** automatisch
- **Weisse Schrift**

---

## Beispiel-Konfigurationen

### Typische Kurs-Seite
```
Hero Bild:        [Pferdebild]
Hero Titel:       [leer]
Overlay:          Mittel (40%)
Bildausschnitt:   Mitte (50%)
```

### Startseite mit Text
```
Hero Bild:        [Panorama-Bild]
Hero Titel:       Willkommen bei der Webwerkstatt
Untertitel:       Reitunterricht & Kurse
Overlay:          Leicht (20%)
Bildausschnitt:   Oben-Mitte (25%)
```

---

## Haeufige Fragen

### Warum sehe ich kein Banner?
Pruefe ob ein Hero-Bild oder Beitragsbild gesetzt ist.

### Das Bild wird abgeschnitten
Aendere den **Bildausschnitt** (0% = oben, 100% = unten).

### Der Text ist schlecht lesbar
Erhoehe die **Overlay Staerke**.