Der Gutenberg-Block Cover besteht aus einem Hintergrundbild, das per Voreinstellung von Gutenberg von semitransparentem Schwarz überlagert ist (Overlay).
Zusätzlich hat ein Cover-Block die Option, das Bild zu fixieren (Hintergrund fixiert) und eine Mindesthöhe festzulegen. Die Vorgabe ist weißer Text (darum der Overlay: Damit man den Text besser lesen kann). Die Textgröße kann geändert werden.
Dies ist ein normales Cover mit Text.
CTA Erweiterung für ein Gutenberg-Cover
Erweiterung für ein Gutenberg-Cover: Unter Erweitert auf der rechten Seiten des Gutenberg-Fensters die CSS-Klasse cta hinzufügen. Acht geben, dass die Rechtschreibkorrektur nicht cat davon macht!
Mein Text auf einem Cover
Hier kann ich auch mehr als eine Zeile schreiben
Text und Bild in einem Cover.
Im Gutenberg-Editor wird das CTA-Cover noch nicht so dargestellt wie im Frontend des Browsers. Hier haben die beiden Blöcke (erster Textblock und die darauf folgende Gruppe) eine weiße Hintergrundfarbe. Auf der Ansichtsseite entsteht keine Lücke zwischen den beiden Blöcken.
CTA-Block einrichten
Cover-Block wählen (immer auf das Symbol achten!) und entweder eine Hintergrundfarbe oder ein Bild für den Hintergrund wählen. Für ein Cover in der vollen Breite des Browserfensters sollte das Bild ~ 1900 bis 2200 Pixel breit sein. Wenn das Cover fixiert wird – also bei Scrollen stehenbleiben soll, sollte es 900 bis 1200 Pixel hoch sein. Damit die Seite schnell geladen werden kann, sind Bilder mit wenig Details und viel Unschärfe die beste Wahl. Hier z.B. 2200 x 1400 Pixel (167 KB):
Cover mit Titel
Als es klingelte, nachts es war kurz vor halb zehn, wurde niemand erwartet und niemand gesehen. Doch dann sahn sie auf einer Urne zuletzt eine fremde Erscheinung und waren entsetzt.
Im Gutenberg-Editor ist nicht immer gut erkennbar, aus welchen Elementen ein Gutenberg-Block aufgebaut ist. Darum überzeugt man sich zwischendurch von Zeit zu Zeit. Das zweite Cover auf dieser Seite besteht aus einem Cover, der erste Absatz im Cover ist ein einfacher Textabsatz (¶), gefolgt von einer Gruppe, in der ein Absatz und danach ein Bild liegen.
text für cover
Und text