Wie man den WordPress-Block-Editor verwendet (Anleitung für Anfänger)

Der WordPress-Blockeditor ist wie jeder andere Page Builder, mit dem Sie tolle Inhalte und Webseiten für Ihre Website erstellen und gestalten können. Er ist in WordPress integriert, sodass jeder eine Website von Grund auf erstellen kann.

Der Gutenberg-Block-Editor, auch Block-Editor genannt, ist der neue Editor, der den alten klassischen Editor ersetzt hat. Der Block-Editor funktioniert anders als der klassische Editor.


WordPress-Block-Editor! Was ist das?

Der WordPress-Block-Editor ist der neue, auf Blöcken basierende Standard-Editor. Blöcke sind wie die Inhaltselemente, die zum Aufbau einer Website oder eines Inhalts erforderlich sind.

Es bietet einen modernen, blockbasierten Ansatz für die Erstellung von Inhalten, der die Gestaltung und Formatierung von Seiten und Beiträgen vereinfacht, ohne dass umfangreiche Codierung oder Tools von Drittanbietern erforderlich sind.


Block-Editor-Schnittstelle

Schauen wir uns die Oberfläche des Gutenberg-Block-Editors und seine Funktionen an.

Hier ist ein kurzer Überblick über die Elemente der Gutenberg-Editor-Schnittstelle: 

  1. Block hinzufügen
  2. Redo/Undo-Taste
  3. Überblick über das Dokument
  4. Siehe
  5. Einstellungen (Blöcke & Post)
  6. Optionen für den Editor

Es gibt sogar noch mehr. Sehen Sie sich das Bild unten an.

  1. Option Suchleiste
  2. Titel des Beitrags oder der Seite hinzufügen
  3. Blöcke im Inhaltsbereich hinzufügen
  4. Installierte & grundlegende WordPress-Bausteine
  5. Schaltfläche "Block hinzufügen
  6. Optionen für Beiträge und Seiten
  7. Optionen blockieren
  8. Blockstile & Einstellungen
  9. Blöcke, Muster und Medien

Da Sie nun mit der Schnittstelle des Block-Editors vertraut sind, lassen Sie uns einen Blick auf die Blöcke werfen, die mit Gutenberg geliefert werden. 


WordPress-Kernbausteine

Da der Gutenberg-Block-Editor auf Blöcken basiert, sollten wir lernen, welche Blöcke mit dem Block-Editor geliefert werden und was sie genau tun.

Inhaltliche Blöcke

Diese Blöcke bilden die Grundlage für die Erstellung textbasierter Inhalte:

  • Absatz: Hier können Sie normalen Text mit Formatierungsoptionen hinzufügen.
  • Überschrift: Zur Erstellung von Überschriften mit sechs Ebenen (H1 bis H6).
  • Liste: Fügt geordnete (nummerierte) oder ungeordnete (Aufzählungslisten) Listen hinzu.
  • Zitat: Formatieren Sie den Text als Blockzitat mit optionaler Zitierung.
  • Code: Zeigt rohe Codeschnipsel in einem formatierten Block an.
  • Vorformatiert: Fügt Text unter Beibehaltung der Abstände und der Ausrichtung ein.
  • Tabelle: Erstellt einfache Tabellen für die Datenpräsentation.
  • Strophe: Für Gedichte oder anderen vorformatierten Text mit besonderen Abständen.

Schöne Tische erstellen
Mit Block-Editor

Medienblöcke

Mit diesen Blöcken können Sie verschiedene Arten von Medien einbetten und anzeigen:

  • Bild: Fügt einzelne Bilder mit Beschriftungen und Ausrichtungsoptionen hinzu.
  • Galerie: Erzeugt Bildergalerien mit anpassbaren Layouts.
  • Video: Bettet Videos ein, die in die Medienbibliothek hochgeladen wurden.
  • Audio: Fügt abspielbare Audiodateien direkt auf der Seite ein.
  • Datei: Uploads und Links zu Dateien zum Herunterladen.
  • Medien & Text: Kombiniert Text und Medien nebeneinander in einem einzigen Block.
  • Abdeckung: Fügt ein Bild oder Video mit überlagerndem Text ein, ideal für Überschriften oder Abschnitte.

Design-Blöcke

Diese Blöcke helfen bei der Seitenstruktur und der visuellen Gestaltung:

  • Rubriken: Erzeugt mehrspaltige Layouts.
  • Gruppe: Gruppiert mehrere Blöcke zur besseren Organisation und Gestaltung.
  • Reihe: Richtet die Blöcke waagerecht in einer Reihe aus.
  • Buttons: Fügt anpassbare Schaltflächen mit Links hinzu.
  • Abstandshalter: Fügt Platz zwischen den Blöcken für Layout-Anpassungen hinzu.
  • Abscheider: Fügt horizontale Linien zur Unterteilung von Abschnitten ein.

Blöcke einbetten

WordPress unterstützt das Einbetten von Inhalten aus verschiedenen Plattformen mit diesen Blöcken:

  • YouTube: Bettet YouTube-Videos ein.
  • Twitter: Bettet Tweets direkt auf der Seite ein.
  • Instagram: Bettet Instagram-Beiträge ein.
  • Spotify: Bettet Spotify-Wiedergabelisten, Alben oder Titel ein.
  • Andere Einbettungen: Unterstützung für Vimeo, Facebook, TikTok, SoundCloud und mehr.

Themenblöcke

Diese Blöcke werden verwendet, um themenbezogene Inhalte hinzuzufügen:

  • Titel des Beitrags: Zeigt den Titel des aktuellen Beitrags oder der aktuellen Seite an.
  • Beitrag Inhalt: Gibt den Inhalt des aktuellen Beitrags oder der aktuellen Seite aus.
  • Beitrag Gekennzeichnetes Bild: Zeigt das hervorgehobene Bild eines Beitrags an.
  • Abfrageschleife: Zeigt dynamisch eine Liste von Beiträgen an, die auf bestimmten Kriterien basieren.
  • Navigation: Fügt Navigationsmenüs hinzu.

Widget-Blöcke

Ermöglicht das Hinzufügen traditioneller Widget-Inhalte in blockbasierte Designs:

  • Suche: Fügt eine Suchleiste hinzu.
  • Neueste Beiträge: Zeigt eine Liste der letzten Beiträge an.
  • Kategorien: Zeigt eine Liste der Beitragskategorien an.
  • Tag Wolke: Zeigt Tags in einem visuell ansprechenden Format an.

Wiederverwendbare und benutzerdefinierte Blöcke

Wiederverwendbare Blöcke: Speichern Sie einen beliebigen Block oder eine Gruppe von Blöcken zur Wiederverwendung auf der gesamten Website.

  • Benutzerdefiniertes HTML: Hinzufügen von benutzerdefiniertem HTML für erweiterte Anpassungen.

Diese Kernbausteine bieten die Grundlage für die Erstellung verschiedener Seitenlayouts und Inhaltstypen ohne zusätzliche Tools und machen WordPress vielseitig und für Benutzer aller Kenntnisstufen zugänglich.


Wie benutzt man den WordPress-Block-Editor?

Der Block-Editor ist ein Kinderspiel, denn er ist sehr einfach zu bedienen. Der WordPress-Block-Editor ist leistungsstark und flexibel und ermöglicht Ihnen die einfache Gestaltung von Seiten und Beiträgen. Wenn Sie sich mit seinen Funktionen vertraut machen, können Sie schnell visuell ansprechende und ansprechende Inhalte erstellen!

Einfügen von Blöcken

Dieser neue Editor unterstützt die Drag-and-Drop-Funktion, d. h. Sie können Ziehen und Ablegen die Blöcke, um neue Layouts und Abschnitte einer Webseite zu erstellen. Um Blöcke zu ziehen und abzulegen, klicken Sie auf "Neuen Block hinzufügen" oben und ziehen Sie die

Sie können Blöcke hinzufügen oder einfügen, indem Sie einfach auf die Schaltfläche "Block hinzufügen" im Editor, geben Sie den Blocknamen ein und fügen Sie ihn in den Editor ein.

Es gibt noch eine andere Methode, mit der Sie Blöcke zum Editor hinzufügen können. Geben Sie einfach "/Blcok Name." Eine Demo finden Sie unten. Probieren Sie es unbedingt aus.

Einen Block duplizieren

Blöcke duplizieren ist ein einfacher Vorgang. Sie können einen Block duplizieren, indem Sie den Block auswählen und die Tastenkombination Strg+Umschalt+D

Sie können dies auch manuell tun. Wählen Sie einen Block und klicken Sie auf die drei vertikalen Punkte im Einstellungsmenü des Blocks (1) um sie zu duplizieren. Wählen Sie dort die Option "Duplizieren". (2). Sobald Sie darauf klicken, wird der Block sofort dupliziert.

Sie können Blöcke duplizieren, indem Sie den Block markieren und das Tastenkürzel Strg+Umschalt+D

Einen Block verschieben

Sie können leicht Blöcke verschieben mit Hilfe der Drag-and-Drop-Funktion oder der Auf- und Ab-Tasten.

Wählen Sie den Block aus, und Sie sehen zwei Pfeile (nach oben und unten). Klicken Sie auf den Pfeil nach oben oder unten, um den Block vertikal zu verschieben.

Alternativ können Sie den Block auch mit dem Ziehgriff an eine beliebige Stelle ziehen.

Löschen oder Entfernen eines Blocks

Das Löschen oder Entfernen eines Blocks ist ganz einfach. Wählen Sie den Block aus und drücken Sie die Schnelltaste Umschalttaste+Alt+Z von Ihrer Tastatur aus.

Sie können dies manuell tun, indem Sie auf die Blockierungseinstellungen klicken und die Option "Blockierung aufheben" auswählen.

Muster erstellen

Ein herausragendes Merkmal des Blockeditors ist Muster erstellen. Dies sind Blöcke, die Sie speichern und in mehreren Beiträgen oder Seiten wiederverwenden können. Diese Funktion ist unglaublich praktisch, da Sie durch die Wiederverwendung von individuell gestalteten Blöcken Zeit sparen können.

Um ein Muster zu erstellen, öffnen Sie die Blockeinstellungen der ausgewählten Blöcke oder eines Blocks, indem Sie auf die drei Punkte klicken und wählen Sie 'Muster erstellen'.

Als nächstes vergeben Sie einen Namen (1) und Kategorien (2) zu Ihrem Block oder Ihren Blöcken und klicken Sie auf die hinzufügen Taste (3).

Dadurch wird Ihr Block in der Gutenberg-Blockbibliothek gespeichert und für die zukünftige Verwendung zugänglich gemacht. Wann immer Sie ihn benötigen, fügen Sie den wiederverwendbaren Block einfach wie jeden anderen Block ein.

Tastaturkurzbefehle

Sie können den Gutenberg-Block-Editor mit Hilfe von Tastaturkürzeln verwenden. Mit diesen Tastenkombinationen können Benutzer schnell navigieren, Text formatieren und Blöcke verwalten, ohne sich auf die Maus verlassen zu müssen.

Diese Tastenkombinationen funktionieren auf der gesamten Editoroberfläche:

  • Strg + S (Windows) / Cmd + S (Mac): Speichern Sie den Entwurf.
  • Strg + Z (Windows) / Cmd + Z (Mac): Die letzte Aktion rückgängig machen.
  • Strg + Y: Wiederholen Sie die letzte Aktion.
  • Strg + Umschalt + Alt + M (Windows) / Cmd + Umschalt + Option + M (Mac): Wechseln Sie zwischen dem visuellen und dem Code-Editor-Modus.
  • Strg + Umschalt + D: Duplizieren eines ausgewählten Blocks
  • Strg + Umschalttaste + , : Ausblenden oder Anzeigen der Einstellungsleiste

Wenn Sie möchten, können Sie siehe die Tastaturkürzel des Editors von WordPress.org.


Mehr Blöcke mit Ultimate Blocks hinzufügen!

Die Standardblöcke im Block-Editor sind fantastisch, um visuell ansprechende Beiträge und Seiten zu erstellen. Aber was, wenn Sie mehr Flexibilität brauchen?

Glücklicherweise unterstützt der Block-Editor die Entwicklung benutzerdefinierter Blöcke, so dass Entwickler ihre eigenen einzigartigen Blöcke erstellen können. Dies hat zu einer Vielzahl von beeindruckenden Gutenberg-Block-Plugins geführt, die von der Community entwickelt wurden. Ein solches Plugin ist Ultimative Blöcke.

Ultimative Blöcke ist ein leistungsstarkes Plugin, das den WordPress-Block-Editor mit 25+ anpassbare Blöcke. Perfekt für Blogger und Vermarkter, enthält es Funktionen wie Bewertungsblöcke, Inhaltsfilter und Call-to-Action-Blöcke, um Engagement und Funktionalität zu verbessern.


Schlussgedanken!

Die Beherrschung des Gutenberg-Block-Editors eröffnet unendliche Möglichkeiten für die Erstellung ansprechender und visuell beeindruckender Inhalte auf Ihrer WordPress-Website.

Ich hoffe, die Anleitung war hilfreich und einfach zu befolgen. Teilen Sie mir Ihre Meinung im Kommentarbereich unten mit. Informieren Sie auch Ihre Freunde über diesen einfachen Leitfaden in Ihren sozialen Medien.

Mehr lesen!



Das Tischberg-Team