Files
help-service/content/theme/hero-banner.md

2.6 KiB

title, description
title description
Hero-Banner 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.