Die Editor-Oberfläche

Der neue Block-Editor „Gutenberg“ unterscheidet sich im Aussehen deutlich von dem bisherigen WordPress Editor. Auf dieser Seite haben wir eine Übersicht zusammengestellt, wo du was im neuen Editor findest. Hier geht es nur um die Editor-Ansicht: wenn du Informationen zu einzelnen Blöcken suchst, schau dich auf der Seite Alles über die Blöcke um.

Obere Editor-Leiste

Screenshot des neuen WordPress Block-Editors. Die obere Editor-Leiste ist hervorgehoben.
Die obere Editor-Leiste wird immer über dem Inhaltsbereich und den Einstellungen angezeigt.

Die Elemente der oberen Editor-Leiste sind ganz links und ganz rechts angeordnet.

Linke Seite

Screenshot der Buttons auf der linken Seite der oberen Editor-Leiste.
Auf der linken Seite in der oberen Editor-Leiste befinden sich fünf Icons.

Am Anfang der Zeile steht das mitunter wichtigste Icon: bei Klick auf das Plus im Kreis wird ein neues Fenster geöffnet, mit dem du neue Blöcke im Inhaltsbereich hinzufügen kannst. Es gibt noch weitere Stellen, an denen das Plus-Icon erscheinen kann, aber hier siehst du es dauerhaft.

Screenshot des geöffneten Inserter-Werkzeugs.
Das Plus-Icon öffnet das Fenster für die Auswahl der Blöcke.

Als zweites Icon folgt ein Pfeil, der nach links zeigt: der „Rückgängig“-Button. Damit kannst du deine jeweils letzte Änderung wiederrufen.

Das dritte Icon ist ein Pfeil, der nach rechts zeigt: der „Wiederholen“-Button. Hast du eine Aktion zuviel rückgängig gemacht, kannst du diese mit Klick auf den Button wiederherstellen.

Das vierte Icon hält interessante Informationen für dich bereit: das i im Kreis gibt dir eine Übersicht deiner inhaltlichen Struktur. Wie viele Wörter, Überschriften, Absätze und Blöcke werden verwendet? Wie ist die Gliederung deines Beitrages anhand der Überschriften? Bei Klick auf die Überschriften gelangst du zur jeweiligen Stelle im Inhaltsbereich.

Screenshot des geöffneten Fensters der Beitragsinformationen.
Das i-Icon zeigt dir alle Informationen zu deinem Beitrag an.

Das fünfte und letzte Icon zeigt dir an, welche Blöcke in deinem Beitrag genau verwendet werden.

Screenshot des geöffneten Fensters der Block-Navigation. Ein Absatz-Block ist ausgewählt und grau hinterlegt.
Mit der Block-Navigation siehst du, welche Blöcke es in deinem Beitrag gibt.

Der graue Hintergrund in der Block-Navigation zeigt an, auf welchem Block gerade der Fokus in dem Beitrag liegt.

Screenshot des geöffneten Fensters der Block-Navigation. Unterhalb eines Spalten-Blocks und einer Spalte ist ein Absatz ausgewählt und grau hervorgehoben.
Die Block-Navigation hilft dir auch dabei, dich in den Spalten zurecht zu finden.

Hast du ein Element ausgewählt, was sich in einem Spalten-Block befindet, bekommst du in der Block-Navigation nur die Inhalte des gesamten Spalten-Blocks angezeigt. Das hilft dir dabei, den richtigen Block zu finden und diesen auszuwählen.

Rechte Seite

Screenshot der Buttons und Einstellungsmöglichkeiten auf der rechten Seite der oberen Editor-Leiste. Der Zustand ist vor dem Veröffentlichen.
Die rechte Seite der oberen Editor-Leiste, wenn du deinen Beitrag gerade begonnen hast.

Wenn du deinen Beitrag gerade beginnst, sieht es auf der rechten Seite in der oberen Editor-Leiste aus wie im Bild oben. Du kannst deinen Entwurf speichern, die Vorschau öffnen und den Beitrag veröffentlichen.

Screenshot der Buttons und Einstellungsmöglichkeiten auf der rechten Seite der oberen Editor-Leiste. Der Zustand ist nach dem Veröffentlichen.
Wenn du einen bereits bestehenden Beitrag editierst, sieht die rechte Seite so aus.

Solltest du einen bereits veröffentlichten Beitrag bearbeiten, ändert sich die rechte Seite leicht. Du kannst den Beitrag jetzt als Entwurf umstellen, dir weiterhin eine Vorschau anzeigen lassen und der „Veröffentlichen“-Button heißt jetzt „Aktualisieren“.

Das Zahnrad auf dem dunklen Button zeigt an, dass du gerade die darunter liegenden Editor-Einstellungen geöffnet hast. Du kannst diese Einstellungen über den Button aus- und wieder einblenden. So kannst du noch ablenkungsfreier Schreiben und hast mehr Platz für deinen Inhalt.

Hinter den drei übereinander gesetzten Punkten verbirgt sich ein erweitertes Menü:

Screenshot des erweiterten Menüs im geöffneten Zustand.
Das erweiterte Menü hintern den drei übereinander gesetzten Punkten enthält viele zusätzliche Einstellungen.

Erweitertes Menü: Ansicht

Unter der Überschrift „Ansicht“ findest du drei Einstellungen, die dir beim Schreiben von Beiträgen behilflich sein können. Sie passen den Editor in seiner Funktionsweise an.

Obere Werkzeugleiste
Screenshot der linken Seite der oberen Editor-Leiste, wenn die erweiterte Werkzeugleiste aktiviert ist. Die Block-Werkzeugleiste wird dort angezeigt.
Die Einstellung „Obere Werkzeugleiste“ verschiebt die Block-Einstellungen vom Block selbst in die obere Editor-Leiste. Hier siehst du die Einstellungen für einen Absatz.

Wenn du die obere Werkzeugleiste auswählst, werden dir die Einstellungen des gerade ausgewählten Blocks nicht mehr am Block selbst, sondern in der oberen Editor-Leiste auf der linken Seite angezeigt.

Spotlight-Modus
Screenshot des Spotlight-Modus, bei dem ein Absatz-Block hervorgehoben ist.
Im Spotlight-Modus werden alle sich nicht in Bearbeitung befindenden Blöcke ausgegraut.

Der Spotlight-Modus kann dir dabei helfen, deinen Fokus nur auf den aktuell ausgewählten Block zu legen. Alle anderen Blöcke werden leicht ausgegraut. So siehst du immer genau, wo du dich gerade im Beitrag befindest.

Vollbildmodus

Im Vollbildmodus werden die oberste Admin-Leiste und das Admin-Menü links komplett ausgeblendet. Der Editor erhält so die volle Breite deines Bildschirms und du kannst ganz ablenkungsfrei deinen Beitrag schreiben. Du kannst den Beitrag im Vollbildmodus über das Icon in der oberen Editor-Leiste verlassen:

Screenshot der Buttons auf der linken Seite der oberen Editor-Leiste. Links davon befindet sich der Button zum Verlassen des Vollbildmodus.
Ganz links erscheint im Vollbildmodus das Icon zum Verlassen des Beitrages.

Bei Klick auf das Icon kommst du zur Beitragsübersicht zurück. Wenn du dann den Beitrag erneut öffnest, ist der Vollbildmodus weiterhin aktiv. Du kannst den Vollbildmodus wieder über die Einstellung im erweiterten Menü deaktivieren.

Erweitertes Menü: Editor

Unter dem Punkt Editor kannst du zwischen zwei Ansichten deines Beitrags wählen: standardmäßig siehst du den Visuellen Editor. Wenn du auf Code-Editor umschaltest, wird dein Beitrag so dargestellt, wie er als Quelltext gespeichert wird.

Achtung!

Der Code-Editor ist nur für fortgeschrittene Benutzerinnen und Benutzer gedacht. Du kannst hier sehr leicht deinen Beitrag kaputt machen, wenn du dir nicht sicher bist, was du tust.

Erweitertes Menü: Werkzeuge

Block-Manager
Screenshot des geöffneten Block Managers.
Die Ansicht des Block-Managers mit allen aktivierten Blöcken der Kategorie „Allgemeine Blöcke“.

Seit der WordPress Version 5.2 gibt es den sogenannten Block-Manager. Hier kann man bestimmte Blöcke global deaktivieren, sodass diese nicht mehr im Inserter-Tool angezeigt und benutzt werden können.

Gerade durch die vielen Block-Library-Plugins, die viele zusätzliche Blöcke mitbringen, kann das Inserter-Tool schnell unübersichtlich werden. Ein anderes Beispiel wäre, die nicht benötigten Embed-Dienste zu deaktivieren, um die Übersicht bei den wichtigen Embed-Diensten zu behalten.

Es können einzelne Blöcke oder ganze Kategorien deaktiviert werden. Klicke dazu einfach auf den Haken beim jeweiligen Element. Zum Speichern verlasse einfach das Fenster des Block-Managers, in dem du auf das Schließen-Symbol oben rechts klickst, oder einfach neben das Fenster in den Editor.

Alle wiederverwendbaren Blöcke verwalten

Der erste Punkt „Alle wiederverwendbaren Blöcke verwalten“ bringt dich zu einer Übersichtsseite, wo du deine bisher gespeicherten, wiederverwendbaren Blöcke aufgelistet siehst und bearbeiten kannst. Was wiederverwendbare Blöcke sind, erklären wir dir auf der Seite Alles über die Blöcke.

Tastaturkürzel

Unter „Tastaturkürzel“ öffnet sich ein Fenster, in dem du alle verfügbaren Tastaturkürzel für den Editor einsehen kannst. Die Tastaturkürzel werden entsprechen deinem verwendeten Betriebssystem (Mac, Windows, Linux) angezeigt. Für alle, die mehr mit der Tastatur und weniger mit der Maus unterwegs sind, ist dies optimal.

Kompletten Inhalt kopieren

Mit „Kompletten Inhalt kopieren“ tust du genau das was es sagt – du kopierst deinen bisher geschriebenen Inhalt komplett und kannst ihn in einem anderen Beitrag wieder einfügen. Alle Blöcke, mit allen vorgenommenen Einstellungen.

Ansicht anpassen

Unter Ansicht anpassen findest du einige Optionen, die du aus diesen Einstellungen im bisherigen Editor kennst, sowie einige neue Funktionen.

Screenshot des geöffneten Fensters des "Ansicht anpassen" Menüs.
Allgemein

„Prüfungen vor der Veröffentlichung aktivieren“ ist standardmäßig eingeschaltet. Vor dem tatsächlichen Veröffentlichen wirst du noch einmal gefragt, ob die Einstellungen für die Sichtbarkeit und der Veröffentlichungszeitpunkt korrekt sind. An dieser Stelle kannst du beide Einstellungen anpassen. Erst nach einem weiteren Klick auf Veröffentlichen wird der Beitrag tatsächlich veröffentlicht.

Mit „Tipps aktiveren“ kannst du dir noch einmal die Tipps anzeigen lassen, die du  beim ersten Aufruf des neuen Editors angezeigt bekommen hast.

Dokument-Bedienfelder

Diese Einstellungen kennst du vielleicht aus dem bisherigen Editor unter „Ansicht anpassen“. Du kannst dabei die jeweiligen Standard-Einstellungen von Beiträgen und Seiten aus- oder einblenden.

Weitere Bedienfelder

Hinter der Einstellung „Eigene Felder“ verbirgt sich die Option für die Anzeige der „Benutzerdefinierten Felder“, wie es im bisherigen Editor hieß. Hier kannst du zusätzliche Felder für denen Beitrag oder deine Seite definieren. Die Einstellungen dafür erscheinen unterhalb deines Beitrages.

Editor-Einstellungen

Screenshot des neuen WordPress Block-Editors. Die Seitenleiste ist hervorgehoben.
Die Editor-Einstellungen befinden sich auf der linken Seite. Im Screenshot sind die Einstellungen für den Beitrag zu sehen.

Die Editor-Einstellungen sind kontextabhängig, das heißt: wenn du keinen speziellen Block ausgewählt hast, werden dir die Einstellungen für den gesamten Beitrag angezeigt. Wenn du einen Block, z. B. einen Absatz oder ein Bild ausgewählt hast, werden dir die Einstellungen für den jeweiligen Block angezeigt.

Du kannst jederzeit aus den Block-Einstellungen wieder in die Beitrags-Einstellungen wechseln, wenn du oben auf „Dokument“ klickst.

Bei Seiten hast du auch hier die Seiten-spezifischen Einstellungen wie z. B. die Seiten-Attribute mit den Templates, der übergeordneten Seite und der Reihenfolge.

Die Inhalte der Beitrags-Einstellungen werden dir bekannt vorkommen: Fast alles, was du im alten Editor auf der rechten Seite in der Spalte gefunden hast, ist hier aufgelistet. „Textauszug“ und „Diskussion“ waren bisher unterhalb des Texteingabefeldes, sind jetzt aber in die rechte Seitenleiste verschoben worden.

In früheren Versionen von Gutenberg war der Permalink nur bei Klick auf den Beitragstitel zu erreichen. Inzwischen kannst du den Permalink auch in der Seitenleiste bearbeiten.

Wenn du einen bereits existierenden Beitrag bearbeitest, gibt es einen Link, um den Beitrag in den Papierkorb zu verschieben. Auch den Autoren kannst du ändern, aber nur dann, wenn du mehr als einen Benutzer in deiner WordPress-Installation angelegt hast.

Wenn dein Theme Beitragsformate unterstützt, werden diese ebenfalls angezeigt. Außerdem kannst du dir die Revisionen des Beitrags ansehen.

Solltest du in deiner WordPress-Installation weitere Felder an deinen Beiträgen haben, so werden diese, wenn sie korrekt eingebunden worden sind, ebenfalls in der Seitenleiste angezeigt. Größere Metaboxen, wie z. B. vom Plugin Yoast, werden dagegen weiterhin unterhalb des Inhaltsbereiches angezeigt.

Inhaltsbereich des Editors

Screenshot des neuen WordPress Block-Editors. Der Inhaltsbereich ist hervorgehoben.
Der Inhaltsbereich, in dem der Content eingetragen wird.

Im Inhaltsbereich kannst du deinen Beitrag gestalten, in dem du die entsprechenden Blöcke für deinen Beitrag auswählst und diese mit Inhalten füllst. Es ist möglich, dass dein Theme bereits Styles deiner Seite in den Editor lädt – so siehst du schon beim Schreiben, wie es nachher auf deinem Blog aussieht. Ist dies nicht der Fall, so werden die standardmäßigen Styles von Gutenberg geladen.

Screenshot der Titelzeile mit sichtbaren Bereich zum Editieren des Permalinks.
Der Permalink und die dazugehörige Bearbeitungsfunktion ist erst nach einem Klick auf den Titel sichtbar.

Ganz oben steht im Editor immer der Titel deines Beitrages. Dort versteckt sich auch die Möglichkeit, den Permalink des Beitrages zu ändern: Bei einem bereits gespeicherten Beitrag klickst du auf den Titel. Darüber erscheint dann der aktuelle Permalink mit der Möglichkeit, diesen zu Bearbeiten.

Seit der Gutenberg Version 4.4 gibt es die Möglichkeit, den Permalink auch von den Editor-Einstellungen aus zu bearbeiten. Dazu musst du auf Dokument klicken, sofern du dich nicht dort befindest. Der Permalink Abschnitt befindet sich an zweiter Stelle hinter „Status und Sichtbarkeit“, das standardmäßig geöffnet ist.

Glückwunsch! Wenn du das hier liest, hast du hoffentlich nicht einfach nur durchgescrollt. 😉 Gönn dir eine kleine Pause, mache dir eine Tasse Kaffee oder Tee, bevor es weitergeht zum nächsten großen Kapitel: Alles über die Blöcke!