---
title: "Block: Hero"
description: "Der **Hero-Block** ist der erste und auffälligste Block einer Seite. Er erscheint ganz oben und prägt den ersten Eindruck. Es gibt zwei Hero-Typen: ## Typ: Slider Wird auf der Startseite eingesetzt. Zeigt mehrere Slides nacheinander an. | Feld | Beschreibung…"
url: "https://www.serways.de/docs/block-hero/"
updated: "2026-03-26"
category: Redaktionelle Handgriffe
---

# Block: Hero

Der **Hero-Block** ist der erste und auffälligste Block einer Seite. Er erscheint ganz oben und prägt den ersten Eindruck. Es gibt zwei Hero-Typen:

## Typ: Slider

Wird auf der Startseite eingesetzt. Zeigt mehrere Slides nacheinander an.

| Feld | Beschreibung |
| --- | --- |
| Hero Type | Auf „Slider" setzen |
| Slides | Liste der Slides (beliebig viele) |
| Slide Type | Simple Image oder Video |
| Make Slide Clickable | Ja/Nein – macht den gesamten Slide anklickbar |
| Slide Link | URL, auf die der Slide verlinkt (wenn klickbar) |
| Desktop Image | Bild für Desktop-Ansicht |
| Mobile Image | Bild für Mobile-Ansicht |

## Typ: Text Overlay

Wird auf Unterseiten eingesetzt. Zeigt ein Hintergrundbild mit Text-Overlay.

| Feld | Beschreibung |
| --- | --- |
| Hero Type | Auf „Text Overlay" setzen |
| Make Hero Clickable | Ja/Nein |
| Desktop BG Image | Hintergrundbild Desktop |
| Mobile BG Image | Hintergrundbild Mobile |
| Headline | Überschrift im Overlay |
| Text Color | Farbe der Schrift (Hell/Dunkel) |
| Text Content | Weiterer Text unterhalb der Headline |

### Screenshot: Backend

![Hero Block – Typ Slider im WordPress-Backend](https://www.serways.de/wp-content/uploads/2026/03/hero-slider-backend.jpg)
Hero Block – Typ Slider im WordPress-Backend

![Hero Block – Typ Text Overlay im WordPress-Backend](https://www.serways.de/wp-content/uploads/2026/03/hero-text-overlay-backend.jpg)
Hero Block – Typ Text Overlay im WordPress-Backend

### Screenshot: Frontend

![Hero Slider auf der Startseite (Frontend)](https://www.serways.de/wp-content/uploads/2026/03/hero-slider-frontend.jpg)
Hero Slider auf der Startseite (Frontend)

![Hero Text Overlay auf einer Unterseite (Frontend)](https://www.serways.de/wp-content/uploads/2026/03/hero-text-overlay-frontend.jpg)
Hero Text Overlay auf einer Unterseite (Frontend)