Gutenberg – Tipps & Tricks, Teil 1: Einstieg

zuletzt aktualisiert: 14.Februar 2019

Bei meinen Gutenberg-Tests im Dezember 2018 war ich alles andere als begeistert. Doch nun, mit Gutenberg 5.03, funktioniert die Arbeit mit dem neuen Editor schon viel besser aus. Entsprechend habe ich in den ersten Januarwochen eine Webseite (Melbourne Cottage) mit dem Gutenberg-Editor gebaut. Es läuft noch immer nicht alles ganz so rund, aber mit ein paar Tricks und zwei zusätzlichen Plugins bin ich zu einem guten Ergebnis gekommen. Im folgenden habe ich meine Gutenberg – Tipps & Tricks für alle zusammengestellt, die ihre WordPress Webseite selber bearbeiten wollen.

Ich werde diesen Beitrag regelmäßig bearbeiten und um neue Tipps & Tricks zu Gutenberg ergänzen.

Ergänzung im Februar: Nachdem ich nun die zweite Webseite mit Gutenberg nachgebaut habe (Rosegger-Apotheke), kann ich sagen: manchmal muss man wirklich mit Gutenberg arbeiten wollen, um nicht aufzugeben. Wenn man allerdings Ruhe bewahrt, dann gibt es immer eine Lösung. Wer die Möglichkeiten, die Gutenberg anbietet nutzt, wird wahrscheinlich wie ich, die Gelegenheit nutzen, das eine oder andere Layout zu überdenken und Alternativen zu finden.

Meine eigene lemon pix media Webseite befindet sich derzeit in einer Zwischenphase. Einige Seiten sind bereits auf das Blocksystem umgestellt, andere warten noch auf ihre Erneuerung. Das ist das Gute, Sie können sich mit dem Umbau von Classic auf Gutenberg Zeit lassen.

Das erste Mal

Ich arbeite seit Jahren mit WordPress und als ich den neuen Editor zum ersten Mal gesehen habe, war ich irritiert (milde ausgedrückt). Lustigerweise entspricht die Gutenberg Methode viel mehr meiner eigenen Arbeitsweise als der alte Editor, aber gewöhnungsbedürftig ist der neue Editor trotzdem. Nicht zuletzt weil man ein gewisses Fingerspitzengefühl entwickeln muss, um die gewünschten Schaltflächen zu finden, zu aktivieren und zu nutzen.

Leider arbeitet Gutenberg nicht einheitlich über alle Blöcke hinweg. So kann man z.B. bei einigen Blöcken die Textausrichtung direkt oberhalb des Blocks einstellen und bei den Überschriftblöcken befindet sich diese Einstellung in der rechten Spalte.

Für meine Arbeit waren folgende Optionen wesentlich:

Block hinzufügen

Block hinzufügen: Das kleine Plus-Zeichen erlaubt Dir einen neuen Block auszuwählen und oberhalb einzufügen.

Bei Spalten hat jeder einzelne Block und der gesamten Spaltenblock jeweils ein Plus-Zeichen. Genial ist, dass Du Blöcke über das Pluszeichen an jeder beliebigen Stelle ergänzen kannst. Du kannst als ohne weiteres einen neuen Absatz zwischen zwei vorhandene Absätzte einfügen, oder im Zuge Deiner Suchmaschinenoptimierung eine zusätzliche Unterüberschrift dazwischenschieben.

Darüber hinaus entsteht ein neuer Block immer dann, wenn Du einen neuen Absatz beginnst. Jeder Absatz kann individuell gestaltet werden.


Block bearbeiten

Block bearbeiten: Hier findest Du eine recht kleine Auswahl an Textwerkzeugen. Über T kannst Du diverse weitere Texteinstellungen vornehmen.


Block bearbeiten

Block-Typ ändern: Leider kann der Block-Typ nicht beliebig geändert werden.
Je nachdem mit welchem Block-Element Du arbeitest, werden Dir nur verwandte Block-Elemente angezeigt.
Wenn Du nicht sicher bist, ob Dein Block-Element angeboten wird, dann ist es schneller einen neuen Block mit dem gewünschten Element anzulegen.


Block verschieben

Block verschieben: Über die Pfeile (links) kannst Du den Block nach oben oder unten verschieben.

Alternativ kannst Du auf die Punkte gehen und den Block mit drag & drop verschieben. Es erscheint ein blauer Strich an Positionen, an denen Du den Block ablegen kannst, kurze Striche für Spalten, lange Striche für Einzeiler.


Mehr Optionen

Gutenberg Einstieg

Die drei senkrechten Punkte am Ende des Blockeditors zeigen Dir Zusatzoptionen an.

Beim Duplizieren wird eine Kopie des Blocks unterhalb des Originals eingefügt.

Anstelle der Pfeile links kann ‘davor’ und ‘danach’ zum verschieben des Blocks benutzt werden.

Du kannst einen einzelen Block oder auch eine Blockgruppe als wiederverwendbaren Block speichern.


Gutenberg – Block-Elemente

Gutenberg Einstieg

Wenn Du einen neuen Block über das Pluszeichen ergänzt, öffnet sich dieses Auswahlmenü für Blockelemente.

Wie Du siehst haben sich meine zusätzlichen Plugins CoBlocks und Atomic Block in die Liste eingereiht und auch Yoast bietet Blöcke an.

An der letzten Stellen findest den Punkt ‘Wiederverwendbar’. Dieser erscheint, sobald Du einen Deiner Blöcke zur Wiederverwendung abgespeichert hast.


Einstellung rechte Seite

Gutenberg Einstieg

Je nach Block-Element findest Du auf der rechten Seite eine Reihe an Einstellungsoptionen. Im Bild siehst Du z.B. die Einstellungsoptionen für Überschriften.


Individuelle Farben

Gutenberg Einstieg

Du hast die Möglichkeit über das bunte Farbfeld, den Farbdialog zu öffnen und Deinen eigenen Farbwert einzugeben.


Speichern & Vorschau

Es hat eine Weile gedauert, bis ich mitbekommen habe, dass man die Vorschau nur einmal generieren muss. Sobald eine Vorschau-Seite generiert ist (auf Vorschau klicken), wird die Vorschau automatisch nach jeder Speicherung aktualisiert. Es gibt eine kleine Zeitverzögerung, aber das Warten lohnt sich. Das Generieren einer Vorschau dauert länger.

Automatische Speicherung und Datenbank bereinigen

Gutenberg führt häufig automatische Speicherungen durch. Auf einer Seite bin ich so auf 127 Revisionen gekommen. Das belastet die Datenbank unnötig und so habe ich mich auf die Suche nach einem geeigneten Plugin gemacht. Zur Zeit teste ich das Plugin WP-Optimize und bisher hat es gute Arbeit geleistet.

Eine ruhige Hand und Geduld

Es gibt diese Momente, in denen man einfach zu ungeduldig ist und nie das richtige Pluszeichen zum Ergänzen eines Blocks erscheint oder man wiedereinmal endlos nach dem gewünschten Block-Element sucht. Da hilft nur eine Pause und eine frische Tasse Tee.

Mehr Gutenberg Tipps & Tricks:

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht.