WordPress Hosting
Basic
Um Inhalte und Beiträge im Content-Management-System (CMS) WordPress zu bearbeiten, ist ein sogenannter Editor notwendig. Für WordPress Websites existieren diese verschiedenen Editor-Typen:
Jeder dieser WordPress Editoren setzt einen eigenen Fokus: Block-Editoren verbinden Textgestaltung mit einfachen Designfunktionen, während bei Classic Editoren insbesondere die Textbearbeitung im Vordergrund steht. Page Builder eignen sich, wenn es um die Optik und das Layout einer WordPress Website geht. STRATO stellt Ihnen die drei Editoren genauer vor und erklärt, welcher Typ zu Ihrer Website passt.
Der Gutenberg Editor gehört zu den Block-Editoren. Seit dem Jahr 2018 und ab WordPress Version 5.0 ist er standardmäßig in das CMS integriert – kostenfrei und ohne extra Plugin. Der Gutenberg Editor auf einen Blick:
Das Hauptmerkmal des Gutenberg Editors ist die Unterteilung einer Seite in einzelne Blöcke. Dazu gehören unter anderem:
Die Block-Funktion macht es einfach, die Inhalte der Seite optisch zu strukturieren und in ein stimmiges Gesamtbild zu bringen: So dient die Gutenberg-Ansicht im Backend als grobe Orientierung für das finale Design.
Gut zu wissen: Wie genau das Layout der Seite im Entwurfs-Modus aussieht, richtet sich nach dem gewählten WordPress Theme. Wer also optische Anpassungen vornehmen will, muss vom Block-Editor über das WordPress Dashboard in den Customizer wechseln: Dort wird die Website im Frontend-Design des Themes angezeigt – inklusive einer detaillierten Werkzeugleiste, um die einzelnen Blöcke zu stylen.
Der Gutenberg Editor von WordPress eignet sich für alle, die Inhalte im CMS ohne großen Aufwand in eine optische Struktur bringen möchten. Im Gegensatz zu einem Page Builder befinden sich die Design-Möglichkeiten allerdings auf einem Basis-Niveau. So sind für individuelle Wünsche weitere Plugins oder Programmierkenntnisse erforderlich.
Bis WordPress Version 5.0 war der Classic Editor der Standard, um Seiten und Beiträge zu erstellen. Das Backend erinnert an ein typisches Textverarbeitungsprogramm: Wie in einem Word-Dokument lassen sich Überschriften und Absätze an einem Stück schreiben. Die Werkzeugleiste bietet grundlegende Formatierungsmöglichkeiten. Dazu können Bilder und Medien über den Button „Dateien hinzufügen“ im Text platziert werden. Der Classic Editor auf einen Blick:
In Sachen Design ist der Classic Editor vollständig vom WordPress Theme abhängig – wer das Layout selbst gestalten möchte, benötigt grundlegendes technisches Verständnis. Deshalb eignet sich der klassische Editor vor allem für schlichte Websites, bei denen das regelmäßige Veröffentlichen von Texten oder Blogeinträgen im Fokus steht. Da der Code der Seite kaum Design-Informationen enthält, ist die Ladezeit der Website sehr kurz. Sie möchten lieber den Classic Editor anstatt des Block-Editors nutzen? Dann gehen Sie wie folgt vor:
Tipp: Mit dem Plugin Advanced Editor Tools (früher: TinyMCE Advanced) lassen sich die Funktionen des Classic Editors erweitern. So können Sie zum Beispiel leichter Tabellen erstellen oder eine „Suchen und Ersetzen“-Funktion nutzen.
Die ersten Page Builder kamen 2012 als Theme-Plugins auf den Markt, um die Design-Optionen des Classic Editors zu erweitern. Heute finden sie vor allem bei optisch anspruchsvollen Seiten Anwendung. Zu den bekanntesten Page Buildern gehören Elementor (kostenfreie Basisversion verfügbar) sowie die kostenpflichtigen Plugins WPBakery und Divi. Page Builder auf einen Blick:
Ein Page Builder nutzt ähnlich wie der Gutenberg Editor ein Block-System, um die Inhalte einer Seite anzuordnen. Per Drag and Drop lassen sich Gestaltungs-Elemente direkt einfügen, beispielsweise: Textpassagen, Bilder und Videos.
Gut zu wissen: Das Backend von visuellen Page Buildern entspricht dem Frontend. Jede Änderung im Design wird so direkt beim Editieren der Inhalte sichtbar, was die Gestaltung der Seite erleichtert. Auch Format-Einstellungen für die mobile Ansicht der Seite lassen sich direkt im Editor vornehmen.
Beispiel: In einem Page Builder lässt sich die Anordnung von Text und Bild auf mobilen Endgeräten genauestens regeln. Während Textblock und Foto in der Desktop Ansicht problemlos nebeneinander passen, ist in der mobilen Ansicht aufgrund der geringeren Laufweite eine spezifische Anordnung notwendig. Über den Page Builder können Nutzende einstellen, ob das Bild oberhalb vom Text angezeigt werden soll oder umgekehrt – einige Elemente lassen sich mobil sogar komplett ausblenden.
Page Builder konzentrieren sich auf Punkte wie Layout und Optik und eignen sich für komplexe Websites mit einem Fokus auf Design. Wer mit einem Page Builder arbeiten möchte, sollte im Umgang mit WordPress erste Erfahrungen und ein Gespür für Ästhetik mitbringen. Die vielen gestalterischen Details im Quellcode der Website führen zu einer hohen Anzahl an Skripten. Die Ladezeit der Website kann dadurch negativ beeinflusst werden.
Jeder WordPress Editor ist anders aufgebaut. Um die in WordPress standardmäßig integrierte Gutenberg Version besser zu verstehen, finden Sie hier die fünf wichtigsten Funktionen des Block-Editors im Überblick – zusammen mit nützlichen Tipps und Tricks.
Alle Anleitungen beziehen sich auf die Ansicht „obere Werkzeugleiste“ in der Bearbeitung mit dem Browser Google Chrome. Mitunter kann es in anderen Browsern wie Mozilla Firefox Abweichungen geben.
Der Gutenberg Editor bietet vier verschiedene Möglichkeiten, die Ansicht anzupassen. Klicken Sie dafür auf die drei Punkte oben rechts neben dem Button veröffentlichen – dann können Sie zwischen diesen Optionen wählen:
Tipp: Sie deaktivieren den Modus „Ablenkungsfrei“, indem Sie mit Ihrer Maus in den oberen Bereich der Bearbeitungsfläche fahren. Nun erscheint die Navigationsleiste des Gutenberg Editors – zusammen mit den drei Punkten, über die Sie die Ansichtsoptionen einsehen und verändern können.
Im Gutenberg Editor beginnt jede neue Seite mit der leeren Überschrift „Titel hier eingeben“. Darunter befindet sich der Platzhalter für einen Block. Sie haben hier zwei Optionen:
Gut zu wissen In einer zusätzlichen Suchleiste können Sie weitere Block-Arten auswählen. Alternativ klicken Sie auf den Button „Alle durchsuchen“, wodurch sich eine Übersicht mit allen zur Verfügung stehenden Möglichkeiten öffnet.
Tipp: Wenn Sie in das Platzhalter-Textfeld klicken und direkt zu schreiben beginnen, nutzen Sie automatisch den Block „Absatz“. So löschen Sie einen angelegten Block – zum Beispiel einen Button:
Der Befehl des dritten Schritts trägt immer den Namen des Blocks. Wenn Sie beispielsweise einen Spalten-Block löschen möchten, hieße der Punkt „Spalten entfernen“. Tipp: Spalten lassen sich als gesamter Block oder einzeln löschen.
Klicken Sie zuerst in das Platzhalter-Textfeld eines neuen Blocks. Oben links in der Editor-Ansicht befindet sich das blaue Kreuz „Block-Inserter umschalten“. Wenn Sie darauf klicken, öffnet sich eine zusätzliche Navigationsleiste mit allen verfügbaren Blöcken. Sie sind in folgende Kategorien unterteilt:
Wenn Sie hier einen Block aussuchen, füllt er automatisch den Platzhalter aus – oder Sie ziehen den Block per Drag and Drop in Ihren Beitrag.
Sie benötigen mehrere Blöcke mit genau demselben Aufbau? Dann nutzen Sie die Gutenberg-Funktion „Einen wiederverwendbaren Block erstellen“:
Wenn Sie nun auf das schwarze Plus klicken, um einen neuen Block anzulegen, können Sie über die Suchleiste nach dem Namen des wiederverwendbaren Blocks suchen.
Tipp: Sie haben die Möglichkeit, Ihre wiederverwendbaren Blöcke zu verwalten. Klicken Sie dafür auf die drei Punkte in der oberen rechten Ecke des Gutenberg Editors und wählen Sie unter dem Menüpunkt Werkzeuge den Befehl „Vorlagen verwalten“ aus.
Wichtig: Sie müssen für diesen Schritt den Editor verlassen: Speichern Sie Ihren Bearbeitungsstand vorher ab.
Auf der linken Seite der Gutenberg-Navigationsleiste befindet sich der Button „Dokumentenübersicht“. Mit einem Klick darauf sehen Sie auf einen Blick in der „Listenansicht“, aus welchen Blöcken Ihre Seite oder Ihr Beitrag besteht.
Gut zu wissen: Diese Funktion hilft Ihnen dabei, Ihre Inhalte gleichmäßig zu strukturieren. Wenn Sie Änderungen vornehmen wollen, müssen Sie bei längeren Beiträgen nicht durch das ganze Dokument scrollen: Sie können direkt in der Übersicht Blöcke beispielsweise kopieren, verschieben oder löschen. Mithilfe der Informationen unter „Semantik“ erhalten Sie einen Einblick in die Zeichen- sowie Wortanzahl des Beitrags – auch die geschätzte Lesezeit wird angegeben.
Beim STRATO WordPress Hosting ist der Gutenberg Editor inklusive – wählen Sie auf Wunsch WordPress mit Page Builder, bei dem das Elementor Plugin bereits vorinstalliert ist und gestalten Sie Ihre eigene Website genau nach Ihren Vorstellungen. Dazu bieten die WordPress Pakete von STRATO eine Reihe an Vorteilen, unter anderem:
Der Umzug Ihrer WordPress Seite zu STRATO gelingt mit diesen fünf Schritten:
Vladimir Simović arbeitet seit 2000 mit HTML & CSS und seit Januar 2004 mit WordPress. Im Laufe der Jahre hat er diverse Fachbücher und Fachartikel publiziert. Seit April 2022 ist er als Redakteur für den Blog-Bereich von STRATO verantwortlich.
Mit dem Block- oder Gutenberg Editor von WordPress können Sie Seiten erstellen. Die Inhalte des Beitrags gliedern sich in einzelne Blöcke, zum Beispiel Überschrift, Absatz, Bild, Spalten, Tabellen oder interaktive Elemente wie Buttons sowie Widgets.
Ab WordPress 5.0 ist der Gutenberg Editor als Standard integriert. Er muss nicht aktiviert werden.
Die Wahl des WordPress Editors hängt von verschiedenen Faktoren ab. Elementor eignet sich für komplexe grafische Seiten, während der Gutenberg Editor Textverarbeitung und Design verknüpft. In Bezug auf die technische Kenntnis ist der Block-Editor eine gute Wahl für Einsteiger, Elementor hingegen für Fortgeschrittene.