Gutenberg Editor

Voraussetzungen für den Gutenberg-Editor

Ab WordPress Version 5.0 ist der Editor standardmäßig in den Core integriert und aktiviert.

Falls dir der Umstieg auf WordPress 5.0 aus technischen Gründen nicht möglich ist oder du bereits einige Beta-Features der neuen Bearbeitungsoberfläche testen willst, dann könnte das das offizielle Gutenberg-Plugin Abhilfe schaffen.

Außerdem kannst du Gutenberg auf der offiziellen Testumgebung ausprobieren. Ohne Anmeldung. Ohne eigene Website.

Der Aufbau des neuen Editors

Die Umstellung vom Classic-Editor auf den Gutenberg-Editor scheint auf den ersten Blick groß, ja schon fast unüberwindbar.

Ich kenne das nur zu gut von meinem ersten Kontakt mit dem neuen Editor. Für 3 Minuten Gutenberg getestet, funktioniert nicht wie erwünscht und direkt die Idee auf ClassicPress zu wechseln im Hinterkopf.

Doch wenn wir mal genauer und weniger emotional auf die neue Bedienoberfläche schauen, dann hat sich – zumindest rein funktional – relativ wenig geändert.

1. Die Obere Werkzeugleiste
2. Der Inhaltsbereich
3. Die Seitenleiste

Die obere Werkzeugleiste

Gehen wir die einzelnen Buttons und Funktionen der oberen Werkzeugleiste einmal gemeinsam von links nach rechts durch

Block hinzufügen

Mit einem Klick auf das Plus-Symbol öffnet sich die Block-Auswahl. In der Block-Auswahl sind alle aktiven Blocks übersichtlich nach Kategorie sortiert. Dank der integrierten Suchleiste kannst du gezielt nach einem Block suchen.

Rückgängig

Mit einem Klick auf den Rückgängig-Pfeil machst du die letzte Änderung rückgängig. Ausversehen gelöschte HTML-Blöcke treiben dich nun nicht mehr zur Verzweiflung.

Wiederholen

Die Wiederholen Funktion wird erst freigeschaltet, nachdem die Rückgängig-Funktion einmal benutzt wurde. Mit einem Klick auf den Wiederholen-Pfeil machst du die rückgängig gemachte Änderung rückgängig, sodass der Status vor dem Rückgängig-machen wiederhergestellt wird.

Inhaltliche Struktur

Prüfe auf einen Blick, ob die inhaltliche Struktur sinnvoll ist und springe mit einem Klick auf die Überschrift zum entsprechenden Abschnitt im Dokument

Block-Navigation

Mit der Block-Navigation lässt sich ein gesuchter Block direkt auswählen. Ich selber habe diese Funktion noch nie genutzt und wüsste ehrlichgesagt nicht wozu.

Speichern

Speichere deinen Seitenentwurf. Dieser Button wird nach dem Klick auf den nebenstehenden Veröffentlichungs-Button verschwinden.

Vorschau

Schaue dir die Vorschau des Beitrags in einem neuen Fenster an.

Veröffentlichen und Aktualisieren

Mit einem Klick auf Veröffentlichen, werden deine Inhalte für deine Leser sichtbar. Bei bereits veröffentlichten Artikeln steht auf dem Button Aktualisieren anstatt Veröffentlichen.

Einstellungen

Mit einem Klick auf das Zahnrad-Symbol wird die Seitenleiste, je nach aktuellem Status, ein- oder ausgeblendet.

Weitere Werkzeuge und Optionen

Hinter den drei untereinander angeordneten Punkten verstecken sich einige Einstellungen, mit denen du den Gutenberg-Editor ein klein wenig an deine Bedürfnisse anpassen kannst.

Obere Werkzeugleiste

Fixiere die Block-Einstellungen an der oberen Werkzeugleiste anstatt direkt am Block. Je nach Bildschirmgröße empfehlenswert bei mehrspaltigen Layouts.

Spotlight-Modus

Hebe den fokussierten Block visuell hervor. Empfehlenswert bei direkt aufeinanderfolgenden HTML-Blocks ohne visuelle Ansicht.

Vollbildmodus

Blende die typische Backend-Umgebung, sprich die Menüleiste und adminbar aus, um ablenkungsfrei zu arbeiten.

Visueller Editor

Die visuelle Ansicht des Gutenberg-Editors ist die voreingestellte Ansicht und für den Basis-Anwender meist ausreichend.

Code Editor

Die Code-Ansicht ist zur Anordnung von nicht verschiebbaren Blöcken nützlich und erfordert ein gutes Auge, damit die visuelle Ansicht nach dem Eingriff in den Code weiterhin funktioniert.

Block-Manager

Schließe ungenutzte Blocks von der Block-Auswahl und den Block-Vorschlägen im Editor aus.

Besonders empfehlenswert, wenn du Block-Bibliotheken mit Plugins hinzugefügt hast und nun gefühlt hunderte Blocks verfügbar sind, die du voraussichtlich niemals nutzen wirst.

Alle wiederverwendbaren Blöcke verwalten

Erhalte eine Übersicht über alle wiederverwendbaren Blöcke und verändere mit nur einem Klick auf deren Bezeichnung die hinterlegten Inhalte.

Tastaturkürzel

Mit einem Klick auf Tastaturkürzel erhältst du eine Übersicht über alle im verfügbaren Tastenkürzel.

Im weiteren Verlauf des Artikels stelle ich dir die Tastenkürzel, die sich in für mich als besonders wertvoll erwiesen haben, in einer übersichtlichen Liste zusammen.

Kompletten Inhalt kopieren

Kopiere den gesamten Inhalt deines Beitrags in die Zwischenablage.

Gespeichert wird genau der HTML-Code, der dir bei der visuellen Ansicht gezeigt wird.

Dementsprechend kannst du ganz einfach einen neuen Beitrag erstellen und das bestehende Layout dort einfügen ohne die Blöcke neu konfigurieren und mit CSS-Klassen ausstatten zu müssen.

Ansicht anpassen

Lege fest, welche Einstellungs-Widgets, auch Meta Boxen genannt, du unter den Dokument-Einstellungen in der Seitenleiste angezeigt haben willst.

Das Social Sharing Tool Shariff bringt beispielsweise eine Meta Box mit, die ich endlich aus meinem Sichtbereich entfernen konnte.

Der Inhaltsbereich

Der Inhaltsbereich besteht während der Erstellung eines neuen Beitrags lediglich aus dem Seitentitel, der für die Erstellung des Permalinks und der Bezeichnung des Beitrags in Menüpunkten verwendet wird.

Solange du keine Inhalte hinzufügst, gibt es hier erst einmal nicht mehr zu sehen.

Deshalb gehen wir direkt zu den seitenspezifischen Einstellungen, die du nach der Wahl des passenden Seitentitels für jeden Beitrag in der Seitenleiste der Gutenberg-Oberfläche treffen solltest.

Die Seitenleiste

Die allgemeinen Einstellungen zu Seiten und Beiträgen befinden sich, wie gewohnt, auf der rechten Seite des Bildschirms.

Um die Meta Boxen mit den seitenspezifischen Einstellungen sichtbar zu machen, muss direkt in der ersten Zeile der Seitenleiste der Dokument-Button ausgewählt sein.

Anschließend kannst du die Einstellungsmöglichkeiten bequem mit nur einem Klick auf den Namen der Meta Box öffnen und schließen, um den Fokus auf das wesentliche zu behalten.

Schauen wir uns am besten direkt die standardmäßigen Meta Boxen an. Da die von Themes und Plugins integrierten Meta Boxen variieren, lasse ich dieser erst einmal außen vor.

Status und Sichtbarkeit

Lege fest, ob und wann dein Beitrag veröffentlicht werden soll

Permalink

Ändere den Link zu deinem Beitrag.

Falls an dieser Stelle etwas wie www.deinewebsite.de/?p=155 steht und du noch keine Beiträge veröffentlicht hast, dann empfehle ich dir die Permalink-Einstellungen unter Einstellungen -> Permalinks auf Beitragsname zu stellen, damit die Links zu Unterseiten für deine Nutzer lesbar werden.

Beitragsbild

Lege ein Bild fest, dass beispielsweise bei der Anzeige der neusten Beiträge oder auf Archivseiten mit dem Seitentitel angezeigt werden soll.

Diskussion

Erlaube oder verbiete Kommentare für diesen Beitrag.

Seiten-Attribute

Wähle ein Template oder einen Elternbeitrag für diesen Beitrag aus.

So funktioniert die Inhalts-Erstellung mit den Blöcken

Um Texte, Fotos und Überschriften in den Inhaltsbereich einzupflegen benötigen wir Blöcke.

Vereinfacht gesagt ist ein Block lediglich die Hülle, in die du die Daten, sprich Texte, Fotos und Verlinkungen, für deinen Artikel einträgst.

Ähnlich einem Shortcode werden im Hintergrund die entsprechenden Funktionen ausgeführt, damit beispielsweise dein YouTube Video-Link automatisch zu einem eingebetteten Video wird.

Als Anwender musst du dich also nicht mehr um die technischen Sachen kümmern, sodass die Seite leichter zu bedienen und potentiell weniger Fehleranfällig ist, weil du nicht mehr im Markup der Seite arbeiten musst.

Nun zur Praxis.

Blöcke einfügen

Um einen Block in den Inhaltsbereich einzufügen, können wir standardmäßig über das Plus-Symbol in der oberen Werkzeugleiste einen Block suchen und hinzufügen.

Das ist für den Anfang vielleicht ganz nett, um die Kategorisierungen der Blöcke zu sehen und sich die Bezeichnungen einzuprägen, doch im alltäglichen Gebrauch geht gibt es eine deutlich zeitsparendere Möglichkeit:

1. Klicke auf den leeren Block mit dem Platzhalter „Schreibe oder Tippe / zur Blockauswahl“ und gib lediglich einen Schrägstrich in das Eingabefeld ein.
2. Mit dem Schrägstrich öffnet sich die Block-Auswahl, sodass direkt im Inhaltsbereich selbst den richtigen Block suchen, finden und mit den Pfeiltasten und der Eingabetaste direkt einfügen kannst.
3. Sobald der entsprechende Block eingefügt ist, kannst du den Inhalt in den Block reinschreiben, oder beim Bild-Block direkt ein Foto aus der Mediathek auswählen und einfügen.

Einstellungen für einzelne Blöcke

Direkt links neben dem ausgewählten Block findest du die Steuerungselemte. Mit den Pfeilen kannst du die Block-Reihenfolge ändern und mit dem dazwischenliegenden Anfasser den Block direkt durch den gesamten Inhalt ziehen und frei platzieren.

Außerdem werden über dem fokussierten Block häufig verwendete Style-Elemente bereitgestellt.

Im Fall meiner Überschrift kann ich neben dem HTML-Tag die Ausrichtung, Text-Stile wie fettgedruckt oder kursiv sowie eine Verlinkung hinzufügen.

Außerdem sind, soweit ich das bis jetzt feststellen konnte, bei jedem Block folgende weiteren nützlichen Optionen verfügbar:

• Block-Einstellungen verbergen lässt die blockspezifischen Einstellungen in der Seitenleiste verschwinden
• Block duplizieren klont den Block. Besonders zeitsparend, um benutzerdefinierte Einstellungen direkt zu übernehmen
• Davor einfügen fügt einen leeren Block vor dem aktuellen ein
• Danach einfügen fügt einen leeren Block nach dem aktuellen ein
• Als HTML bearbeiten zeigt die Code-Ansicht des Block-Inhalts. Nützlich, um beispielsweise das Nofollow-Attribut zu einem Link hinzuzufügen
• Zu wiederverwendbaren Blöcken hinzufügen speichert den aktuellen Block samt Inhalt ab und erstellt eine Art Shortcode. Wiederverwendbare Blöcke können in jedem Beitrag verwendet werden, sodass z.B. eine Autorenbox bequem am Ende jeden Blogbeitrages platziert und zentral über die „obere Werkzeugleiste -> weitere Werkzeuge und Optionen -> Alle wiederverwendbaren Blöcke verwalten“ inhaltlich verwaltet werden kann.
• Block entfernen löscht den aktuellen Block samt Inhalt aus dem Inhaltsbereich

Ganz nebenbei haben sich derzeit in der Seitenleiste die blockspezifischen Einstellungen geöffnet.

In den blockspezifischen Einstellungen kannst du in der Regel CSS-Klassen und Text- sowie Hintergrundfarben festlegen ohne im HTML-Code herumdoktoren zu müssen.

Je nach Block kommen zudem weitere Einstellungen wie HTML-Anker für Überschriften oder Größenverhältnisse für Medien dazu.

Die wichtigsten Tastenkürzel auf einen Blick

Block hinzufügen: /[Blockname]

Block duplizieren: Strg + Shift + D

Einen leeren Block vor dem aktuellen einfügen: Strg + Alt + T

Einen leeren Block nach dem aktuellen einfügen: Strg + Alt + Y

Den aktuellen Block samt Inhalt entfernen: Shift + Alt + Z

Durch Blöcke navigieren: Tab oder Pfeiltaste nach oben und unten

Dokument speichern: Strg + S

Textauswahl fett machen: Strg + B

Textauswahl kursiv machen: Strg + I

Textauswahl unterstreichen: Strg + U

Diese Blöcke gibt es im Gutenberg-Editor

Allgemeine Blöcke

• Absatz: Füge einen Textabschnitt in das Dokument ein
• Bild: Wähle Fotos und Grafiken aus der Mediathek aus, lade neue hoch oder integriere diese von einer externen URL in das Dokument
• Überschrift: Gliedere deinen Beitrag mit Überschriften
• Galerie: Gib mehrere Fotos in einer schicken Kachelansicht aus.
  Einige Themes und Plugins erweiteren diese Funktion von Hause aus auf eine schöne Slideshow.
• Liste: Erstelle Stichwort- und Aufzählungslisten. Mit ein wenig CSS-Kenntnisse kannst du die Listen für deine Besucher als moderne Icon-Listen ausgeben
• Zitat: Erstelle ein Zitat und gib den Autor beziehungsweise die Quelle an
• Audio: Wähle eine Audiodatei aus der Mediathek aus, lade eine neue hoch oder integriere eine von einer externen URL in das Dokument
• Cover: Wähle ein Hintergrundfoto und lege Text darüber. Der Text wird standardmäßig horizontal und vertikal auf dem Bild zentriert. Mit ein wenig CSS erstellst du kinderleicht individuellere Darstellungen
• Datei: Wähle Inhalte aus der Mediathek aus, lade neue hoch und integriere diese in das Dokument
• Video: Wähle ein Video aus der Mediathek aus, lade ein neues hoch oder integriere eines von einer externen URL in das Dokument

Formatierung

• Code: Füge CSS, JavaScript und vieles mehr in das Dokument ein und gebe es dem Nutzer aus. Zeilenabstände und Einrückungen bleiben erhalten
• Classic: Hole dir den vertrauten Classic-Editor in die Gutenberg-Oberfläche und arbeite so, wie du es bereits gewohnt bist
• HTML: Erstelle Inhalte ohne die Unterstützung des Block-Editors und erhalte mehr Kontrolle über die Frontend-Ausgabe ohne eigene Blöcke programmieren zu müssen.
• Vorformatiert: Füge CSS, JavaScript und vieles mehr in das Dokument ein und gebe es dem Nutzer aus.
  Zeilenabstände und Einrückungen bleiben erhalten.
  Im Gegensatz zum Code-Block kannst du beim vorformatierten Block Links setzen und Inhalte wie gewohnt fett und kursiv darstellen.
• Pullquote: Hebe einen Textabschnitt oder ein Zitat besonders hervor. Im Gegensatz zum Zitat-Block kannst du den Inhalt individueller formatieren und stylen
• Tabelle: Erstelle eine Klassische HTML-Tabelle mit beliebig vielen Spalten und Zeilen.
  Beachte, dass die HTML-Tabellen standardmäßig nicht responsive sind. Das bedeutet, dass du eventuell einige Anpassungen vornehmen solltest, um die Tabellen-Inhalte für mobile Nutzer zugänglich zu machen.
• Vers: Erstelle, wie mit dem Absatz-Block, Text-Abschnitte und statte diese mit Leerzeilen aus

Layout-Elemente

• Button: Erstelle eine auffällige Schaltfläche und verlinke Unterseiten oder Anker-Links.
  Wichtig: der Button wird als a-Tag ausgegeben und ist somit kein Button, der für Interaktionen und Manipulationen des DOMs genutzt werden sollte
• Spalten: Erstelle mehrspaltige Layouts, die sich in der mobilen Ansicht automatisch untereinander ausrichten
• Medien und Text: Erstelle ein zweispaltiges Layout, das einen Medien-Block und eine Spalte für Überschriften, Texte, Liste und Buttons bereitstellt
• Mehr: Ausschließlich Inhalte vor dem Mehr-Block werden werden im Textauszug auf der Archivseite angezeigt
• Seitenumbruch: Unterteile deinen Beitrag in mehrere Artikel, die er Nutzer durch eine Seitennavigation unter dem Beitrag bequem durchlesen kann. Kann beispielsweise bei Artikelreihen oder extrem langen Anleitungen nützlich sein
• Trennzeichen: Füge eine horizontale Trennlinie in das Dokument ein, um den Inhalt aufzulockern
• Abstandshalter: Füge einen Abstandshalter in das Dokument ein, um den Inhalt aufzulockern und die Lesbarkeit zu verbessern

Widgets

• Shortcode: Füge einen klassischen Shortcode in das Dokument ein, um den Funktionsumfang auf der Website zu erweitern ohne einen neuen gutenberg-Block programmieren zu müssen
• Archive: Zeige ein monatliches Archiv deiner Beiträge an
• Kalender: Gib ein Kalenderwidget mit den Beiträgen deiner Website aus
• Kategorien: Gib eine Liste mit allen Kategorien deiner Website aus
• Neue Kommentare: gib das beliebte Kommentar-Widget aus
• Neue Beiträge: Zeige deine neuen Beiträge auf einen Blick
• RSS: Zeige eine benutzerdefinierte Anzahl an neuen Beiträgen eines RSS-Feeds an. Ausgabe des Autoren und des Datums sind möglich
• Suchen: Gib eine Suchleiste aus, mit der der Nutzer nach Inhalten innerhalb deiner Website suchen
• Schlagwörter-Wolke: Gib eine mit allen Taxonomien deiner Website in einer Wolkenansicht aus

Einbettungen

Mit dem allgemeinen Einbetten-Block integrierst du Iframes, wie z.B. Google Maps oder Playlists von Streaming-Diensten, mit einem einfachen Einbettungslink in deine Website.

Außerdem gibt es einzelne Blöcke für die komfortable Einbettung folgender Dienste:

• Twitter
• YouTube
• Facebook
• Instagram
• WordPress
• SoundCloud
• Spotify
• Flickr
• Vimeo
• Animoto
• Cloudup
• CollegeHumor
• Crowdsignal
• Dailymotion
• Hulu
• Imgur
• Issuu
• Kickstarter
• Meetup.com
• Mixcloud
• Reddit
• ReverbNation
• Screencast
• Scribd
• Slideshare
• SmugMug
• Speaker Deck
• TED
• Tumblr
• VideoPress
• WordPress.tv
• Amazon Kindle

Vor- und Nachteile des Gutenberg-Editors

Vorteile

• Geringe Ladezeit im Frontend
  

  Der Gutenberg-Editor bringt selbst nur zwei kleine Stylesheets ins Frontend ein und ist somit wohl der minimalistischste visuelle Editor für WordPress.

• Reduzierung von Markupfehlern
  

  Die visuelle Oberfläche im Backend ermöglicht dem Standard-Anwender Inhalte zu erstellen und CSS-Klassen zuzuweisen ohne händisch im HTML-Markup arbeiten zu müssen.

  Dadurch ist eine der Hauptfehlerquellen für fehlerhafte Beitragsansichten und langwierige Fehlersuche-Sessions eliminiert.

• Einfache Shortcode-Erstellung
  

  Die Möglichkeit einen Block als wiederverwendbaren Block zu definieren ermöglicht die schnelle Erstellung und Verwaltung von einfachen Shortcodes.

• Achtet auf Accessebility
  

  WordPress ist bekannt dafür, die Barrierefreiheit ernst zunehmen. Der Abstandshalter-Block enthält beispielsweise das aria-hidden-Attribut, sodass dieses inhaltsleere Design-Element für assistive Technologien „ausgeblendet“ wird.

  Bei Plugins, wie Page Buildern und Block-Erweiterungen, liegt es am Plugin-Autor diese Ansprüche an die eigene Arbeit zu haben und umzusetzen.

• Einheitlichere Inhaltsdarstellung
  

  Dank Gutenberg wird die Backend-Ansicht zunehmends einheitlicher mit der Frontend-Ausgabe, was besonders Einsteigern ohne HTML und CSS-Kenntnisse zu Gute kommt.

• Übernimmt die Formatierungen aus Word
  

  Artikel können weiterhin in Word vorgeschrieben und in den Editor eingefügt werden ohne das Überschriften, Verlinkungen und die sonstigen Basis-Textformatierungen verloren gehen. Ich liebe es!

• Nachhaltiger Basis Page Builder
  

  Streng genommen ist der Gutenberg-Editor eher ein visueller Editor als ein Page Builder, weil aufwendigere Layouts derzeit nur mit eigenem Coding oder Erweiterungen möglich sind.

  Im Vergleich zu den vielen beliebten Page Builder Plugins im WordPress Kosmos gibt es jedoch endlich eine Grundlage, auf der wir nachhaltig Erweiterungen aufbauen können. Denn im Gegensatz zu einem Drittanbieter-Plugin ist die Lauffähigkeit des Gutenberg-Editors in den nächsten Jahren so gut wie sicher.

Nachteile

• Aufwendige Erstellung und Integration von Blöcken
  

  Blockanpassungen und eigene Blöcke mit spezifischen Funktionen sind langfristig unabdingbar, um die visuelle Ansicht im Backend aufwändigerer Websites beizubehalten.Das kostet je nach Situation entweder viel Zeit oder Geld, wenn die Abhängigkeiten zu Drittanbieter-Plugins gering gehalten werden sollen.

  Anmerkung nachdem ich einige Blöcke selbst erstellt habe:
  Die Block-Erstellung dauert meist länger als die eines Shortcodes, aber endet nun auch nicht in tagelangen Coding-Sessions, sodass ich diesen Punkt mit Blick auf den Konfort, den ein Block dem Nutzer bietet, eher neutral sehe. – 14.06.2019

• Strukturelle Änderungen sind aufwendig
  

  Längere Artikel, wie z.B. meine Anleitung zur WordPress Installation mit fast 5.000 Wörtern, über 50 Fotos und knapp 250 Blöcken lassen sich nur mit hohem Aufwand strukturell verändern.Mal eben eine Überschrift samt dazugehöriger Absätze und Medien verschieben ist derzeit nicht möglich. Hierfür wäre ein Core-Container-Block, von mir aus ohne Frontend-Markup, super.

• Begrenzter HTML-Block

  Grundsätzlich erwarte ich bei einem HTML-Block volle Freiheit.
  Leider sorgen data-attribute und onclick-Anweisungen per Default für eine Fehlermeldung beim abspeichern des Dokuments.Da Anwender mit diesen Ansprüchen eher fortgeschritten sind und sich die entsprechenden Tags und Attribute einfach mit dem wp_kses_allowed_html-Filter erlauben lassen, vergebe ich hier nur einen halben Negativpunkt.

• Fehlerhafte Artikelvorschau

  Leider buggt die Artikelvorschau bei mir auch in WordPress 5.2 noch. Im Vergleich zu WordPress 5.1 wird mittlerweile wenigstens eine Vorschau der Inhalte angezeigt, jedoch ohne meine eigenen CSS-Anpassungen und damit optisch fehlerhaft.Da dieser Fehler auch an meinem Theme liegen könnte, vergebe ich nur einen halben Negativpunkt.

Weiterführende Informationen

Gutenberg deaktivieren

Wenn du einfach nicht mit dem Gutenberg-Editor warm wirst, dann kannst du die neue Bearbeitungsoberfläche einfach mit dem Classic Editor Plugin deaktivieren.

Alternativ tut es auch eine Zeile Code in der functions.php:

add_filter('use_block_editor_for_post', '__return_false');

Gutenberg anpassen

Anleitungen, mit denen du den Editor mehr auf deine Bedürfnisse zuschneiden und deinen Workflow optimieren kannst:

Option 1: Block Styles hinzufügen

Mit einem WordPress Block Style kann ein Redakteur einem Block eine CSS-Klasse über eine visuelle Oberfläche zuweisen. (Beispiel: „Kontur“ und „Füllung“ beim Buttons-Block.)

Der Vorteil hierbei ist, dass Redakteure den Style Guide deiner Website leicht einhalten können ohne, dass du den Redakteuren die einzelnen CSS-Klassen deiner Seite stundenlang erklären musst.

• Tutorial: WordPress Block Styles

Option 2: Block Variations erstellen

Mit einer Block Variation kannst du bestehende Blöcke mit Attributen oder Kind-Blöcken füllen und diese als Vorlage in den Inserter integrieren.

Redakteure können somit beispielsweise direkt eine Vorlage für einen Spaltenblock mit den entsprechenden CSS-Klassen und Kind-Blöcken in den Content integrieren und müssen nicht mehr manuell in den Block-Einstellungen werkeln.

• Tutorial: WordPress Block Variations

Option 3: WordPress Blöcke entwickeln

Mit einem eigenen Block kannst du Funktionen abbilden, die die Core-Blöcke nicht hergeben und gleichzeitig auf den unnötigen Ballast verzichten, den die ganzen Block-Bibliotheken mitbringen.

• Tutorial: WordPress Block entwickeln