Ein gutenberg-kompatibles Theme aussuchen

Die Theme-Autoren machen ihre Themes gerade fit für Gutenberg. Aber was ist drin, wenn „gutenberg-kompatibel“ draufsteht?

Gutenberg Basis-Funktionen

Damit ein Theme gutenberg-kompatibel ist, muss es zunächst das nötige CSS an Bord haben, das die Darstellung der Gutenberg-Blöcke im Theme steuert. Es sollten keine Fehler im Layout entstehen und die Blöcke sollten im Design des Themes dargestellt werden. Das Theme muss zum Beispiel die Inhaltsbreiten von Gutenberg unterstützen.

Die meisten Themes unterstützen diese Mindestanforderungen.

Erweiterte Gutenberg-Funktionen

Mit Gutenberg lässt sich aber viel mehr machen. Themes können eine ans Theme angepasste Farbpalette haben zum Beispiel.

Entwickler, die sich auf Gutenberg spezialisieren, integrieren zum Beispiel alternative Designs für die Standard-Blöcke und/oder sie bieten individuelle Gutenberg-Blöcke als Plugin an, mit denen man das Theme durch zusätzliche Layout-Module ergänzen kann.
Es ist außerdem hilfreich, wenn man das Design des Themes im Gutenberg-Editor sehen kann. Damit das funktioniert, können die Autoren das Theme mit editor-styles ergänzen.

Welche dieser Punkte ein gutenberg-kompatibles Theme unterstützt, musst du im Zweifelsfall ausprobieren.

Weiterlesen Ein gutenberg-kompatibles Theme aussuchen

Den Gutenberg-Editor um eine eigene Farbpalette erweitern

Für einige Gutenberg-Blöcke kann man Farben auswählen, eine Hintergrundfarbe und eine Textfarbe. Diese Farben kann man sich aus einer Farbpalette aussuchen.

In der Standardeinstellung bringt der Gutenberg-Editor eine Farbpalette mit vordefinierten Farben mit. Zusätzlich gibt es noch die Option, eine eigene Farbe auszuwählen: Wenn man auf den Link „individuelle Farbe“ klickt, öffnet sich ein Color-Picker.

Eine individuelle Farbpalette für mein Theme

Die Standardfarben sind einfach irgendwie bunt und passen wahrscheinlich nicht so recht zum Theme. Deshalb bringen gutenberg-kompatible Themes in der Regel ihr eigenes Farbschema mit. Meistens muss man hier nichts machen. Nur wer eigene Themes entwickelt muss selbst Hand anlegen.

Die Farbpalette findet man in der rechten Seitenleiste unter „Farbeinstellungen“.

Weiterlesen Den Gutenberg-Editor um eine eigene Farbpalette erweitern

Im Gutenberg-Editor mit CSS-Klassen arbeiten

Eine relativ einfache Methode, das Aussehen eines Gutenberg-Blocks anzupassen, ist das Arbeiten mit CSS-Klassen.

Bei jedem Gutenberg-Block gibt es die Möglichkeit, eine CSS-Klasse einzutragen. Ich arbeite viel mit solchen Helfer-Klassen. Sie lassen sich gut in die CSS-Systematik eines Projekts integrieren.

Das Feld dafür findest du unter Erweitert/Zusätzliche CSS-Klassen(n).
Hier die CSS-Einstellung für den Absatz-Block:

Weiterlesen Im Gutenberg-Editor mit CSS-Klassen arbeiten

Mit Text- und Überschrift-Blöcken arbeiten im Gutenberg-Editor

Mit dem Gutenberg-Editor hat sich das Arbeiten mit Texten verändert. Jede Überschrift, aber auch jeder Absatz, ist jetzt ein eigener Block.

Man muss sich beim Schreiben von Texten also ein bisschen umgewöhnen. Man schreibt nicht mehr alles hintereinander weg ein einen „Kasten“ hinein, sondern man produziert einzelne Blöcke. Diese Blöcke kann man dann einzeln bearbeiten.

ZUM WEITERLESEN
Was ändert sich für meine Website mit Gutenberg

Absatz oder Überschrift verschieben

Man kann zum Beispiel Absätze und Überschriften im Text verschieben. Ich nutze das sehr viel. Im alten Editor konnte man einen Text nur durch ausschneiden und einfügen von der Stelle bewegen. So geht es viel schneller.

Weiterlesen Mit Text- und Überschrift-Blöcken arbeiten im Gutenberg-Editor

Was ändert sich mit Gutenberg für meine WordPress-Website?

Mit dem WordPress-Editor Gutenberg ändert sich die Art, wie wir mit WordPress Inhalte und Layouts erstellen. Wer eine WordPress-Website neu aufsetzen oder überarbeiten möchte, kommt an Gutenberg nicht vorbei. Aber auch Theme-Autoren müssen sich umstellen.

Was ist anders mit Gutenberg?

Im alten Editor gab es einen festgelegten Bereich, in dem man seine Texte reingeschrieben hat. Wie im Textverarbeitungsprogramm schrieb man alles untereinander weg: Überschriften, Absätze, Zitate, Listen und so weiter.

Gutenberg bricht mit dieser Gewohnheit. Mit dem neuen Editor ist jedes Element ein Block. Ein Absatz ist ein Block, eine Überschrift ist einer. Eine Liste, ein Bild und eine Galerie sind auch jeweils ein Block.

Wozu ist das gut?

Bisher musste man am Editor vorbei arbeiten, wenn man mit WordPress irgendetwas anderes produzieren wollte als einen klassischen Blog-Artikel. Inhalte in Spalten oder ähnlichen Layout-Elemente aufzuteilen klappte nur mit Tricks. PageBuilder füllten diese Lücke.

Weiterlesen Was ändert sich mit Gutenberg für meine WordPress-Website?