1. Home
  2. Docs
  3. WordPress
  4. WordPress – Anwende...
  5. Arbeiten mit Blöcken

Arbeiten mit Blöcken

Jeder Inhalt im WordPress-Blockeditor ist ein Block. Sie sind die Bausteine dienes Beitrags oder deiner Seite.

Der WordPress-Blockeditor bietet eine Reihe von Blöcken , mit denen du medienreiche Seiten und Beiträge erstellen kannst. Du kannst das Layout der Blöcke problemlos steuern, um optisch ansprechende Webseiten zu erstellen.

Du kannst Blöcke für Absätze, Bilder, Überschriften, Listen, Videos, Galerien und mehr hinzufügen . WordPress verfügt über Blöcke für alle gängigen Inhaltselemente, und durch  WordPress-Plugins können weitere hinzugefügt werden .

Die Anatomie eines Blocks

Jeder Block besteht aus einer Block-Symbolleiste, einer Blockeinstellungs-Seitenleiste und dem Blockinhalt.

Anatomie eines Blocks
Anatomie eines Blocks

Du kannst jeden Block unabhängig von den anderen Blöcken im Beitrag oder auf der Seite bearbeiten, anpassen oder verschieben.

Die Bearbeitungsoptionen in der Block-Symbolleiste variieren je nach dem Block, den du aktuell bearbeitest.

Jeder der Blöcke verfügt über seine eigenen Formatierungseinstellungen im Einstellungsfenster der Block-Seitenleiste, was eine bessere Kontrolle über das Layout und das Erscheinungsbild des Blocks bietet.

So fügst du einen Block hinzu

Es gibt verschiedene Möglichkeiten, Blöcke zu deinem Beitrag oder deiner Seite hinzuzufügen . Du kannst einen Block überall im Beitrag oder auf der Seite mithilfe der Schaltfläche + (  Block Inserter genannt) hinzufügen . Du kannst auch die Suchfunktion verwenden, um den gewünschten Block schnell zu finden und ihn dem Beitrag oder der Seite hinzuzufügen.

Einzelheiten zum Hinzufügen eines Blocks zu deinem Beitrag oder deiner Seite findest du demnächst mehr in unserem Handbuch .

So konfigurierst du einen Block

Jeder Block verfügt über einen eigenen Satz an Werkzeugen zum Anpassen des Layouts und Erscheinungsbilds des Blocks.

Block-Symbolleiste

Wähle einen Block aus, um die Block-Symbolleiste oben im Block anzuzeigen .

Block-Symbolleiste für den Bildblock
Block-Symbolleiste für den Bildblock

Die Blocksymbolleiste enthält die Formatierungsoptionen für den ausgewählten Block. Diese Optionen in der Blocksymbolleiste variieren je nach eingefügtem Block.

Zu den am häufigsten verwendeten Optionen in der Block-Symbolleiste zählen die folgenden:

Transformieren : Normalerweise ist die erste Option in der Block-Symbolleiste Transformieren ( im Screenshot unten mit 1 markiert ). Damit kannst du den ausgewählten Block in eine Liste anderer unterstützter Blocktypen ändern.

Block-Symbolleistenoptionen
Block-Symbolleistenoptionen

Wenn du beispielsweise einen Absatzblock hinzufügen und ihn in einen Zitatblock, Überschriftenblock, Listenblock oder Pullquote-Block ändern möchten, werden dir durch Klicken auf dieses Symbol die Optionen aus dem Dropdown-Menü angezeigt. 

Die Transformationsoptionen variieren je nach ausgewähltem Block.

Wenn ein Block transformiert wird, bleiben die vorhandenen Blockstile nach der Blocktransformation erhalten.

Wenn ein Block transformiert wird, bleiben die im Abschnitt „Zusätzliche CSS-Klasse(n)“ unter „Erweitert“ in der Seitenleiste „Blockeinstellungen“ hinzugefügten zusätzlichen Klassen auch nach der Blocktransformation erhalten.

Nach oben/unten verschieben : Klicken Sie auf den Aufwärts- oder Abwärtspfeil ( im Screenshot oben mit 3 markiert ), um den Block auf der Seite um eine Position nach oben/unten zu verschieben. Lesen Sie mehr über das Verschieben der Blöcke .

Ziehen : Klicke und halte das Symbol, das wie sechs Punkte aussieht ( im Screenshot oben mit 2 markiert ), um den Block in einen anderen Abschnitt der Seite zu ziehen.

Weitere Optionen:  Die drei vertikalen Punkte ( im Screenshot oben mit 4 markiert ) öffnen ein Menü mit zusätzlichen Einstellungen, mit denen du den Block weiter anpassen können. Lese mehr über die Option „Weitere Optionen“ .

HINWEIS : Wenn du auf die drei Punkte rechts neben dem Symbol „Einstellungen“ in der oberen rechten Ecke klicken und die Option „Ansicht > Obere Symbolleiste “ aktivieren , wird die Block-Symbolleiste oben im WordPress-Block-Editor integriert, anstatt direkt über dem Block angezeigt zu werden.

Blocksymbolleiste mit der oberen Symbolleiste kombiniert
Blocksymbolleiste mit der oberen Symbolleiste kombiniert

Blockeinstellungen

Wenn du einen Block auswählst, findest du zusätzliche Einstellungen in der Seitenleiste rechts neben dem WordPress-Blockeditor.

In der Seitenleiste kannst du zwischen den Einstellungen für den aktuellen Beitrag oder die aktuelle Seite ( im Screenshot unten mit 1 markiert ) und den Einstellungen für den ausgewählten Block ( im Screenshot unten mit 2 markiert ) wechseln.

Um die Seitenleisteneinstellungen anzuzeigen oder auszublenden, klicke oben rechts im Editor auf das Symbol ( im Screenshot unten mit 3 markiert ).

Block- und Beitrags-/Seiteneinstellungen in der Seitenleiste
Block- und Beitrags-/Seiteneinstellungen in der Seitenleiste

In den Beitrags-/Seiteneinstellungen kannst du Tags und Kategorien hinzufügen, ein hervorgehobenes Bild auswählen und vieles mehr – diese Einstellungen gelten für den gesamten Beitrag oder die gesamte Seite.

Die Blockeinstellungen in der Seitenleiste enthalten erweiterte Anpassungsoptionen für den jeweiligen Block, an dem du gerade arbeitest. Jeder Block hat seine eigenen Einstellungen, die du hier erkunden kannst. Die Einstellungen variieren je nach dem Block, an dem Sie arbeiten.

Block-Seitenleisteneinstellung für Absatzblock
Block-Seitenleisteneinstellung für Absatzblock
  • Oben in der Block-Seitenleisteneinstellung ( im Screenshot oben mit 1 markiert ) findest du eine kurze Beschreibung des Blocks.
  • Darunter findest du verschiedene erweiterte Einstellungen wie Farbe, Typografie, Rahmen, Dimensionssteuerelemente für Ränder, Polsterung usw.
  • Wenn du auf das Menüsymbol mit den drei Punkten ( im Screenshot oben mit 2 markiert ) klickst, wird ein Fenster mit weiteren Anpassungsoptionen für die Einstellungen geöffnet.

So setzen Sie die Steuerung zurück

  • Wenn du Anpassungen an den Steuerelementen vornimmst, diese aber zu den ursprünglichen Einstellungen wiederherstellen möchtest, kannst du dies ganz einfach tun, indem Sie das Menüsymbol mit den drei Punkten ( im Screenshot oben mit 2 markiert ) auswählen und auf „ Alles zurücksetzen“ klicken . Dadurch werden die Einstellungen zurückgesetzt und alle Ihre Änderungen gelöscht.
Reset-Option
Reset-Option
  • Der einzige Abschnitt, der in allen Blockeinstellungen verfügbar ist, ist der   Abschnitt „Erweitert“ ( im Screenshot oben mit 3 markiert ). „Erweitert“ öffnet sich mit diesen beiden Optionen, wenn du auf den Abwärtspfeil klickst ( im Screenshot oben mit 4 markiert ):
    • HTML-Anker zum direkten Verlinken zu einem Abschnitt deiner Beitrags oder deiner Seite.
    • Zusätzliche CSS-Klassen zum Hinzufügen einer CSS-Klasse zum Block, mit der du benutzerdefiniertes CSS schreiben kannst, um diesen bestimmten Block zu formatieren. Eine CC-Klasse kann ein einzelnes Wort sein, z. B.  specialoder ein Begriff, der aus mehreren Wörtern besteht, wobei jedes Wort durch Bindestriche getrennt ist, z. B.  special-class. Du kannst demselben Block mehrere Klassen hinzufügen, indem du jede Klasse durch ein Leerzeichen trennst. Beispiel: special-class-1 special-class-2

So sperrst und entsperrst du einen Block

Du kannst die Verschiebung und/oder Entfernung eines Blocks sperren.

Klicke in der Block-Symbolleiste auf die Menüoption mit den drei Punkten und wähle „Sperren“. Dadurch wird ein Dialogfeld geöffnet, in dem du die Optionen „Entfernen verhindern“ und/oder „Bewegung deaktivieren“ aktivieren kannst Sobald du auf „Übernehmen“ klickst, wird der Block gesperrt.

Basierend auf den Einstellungen, die du beim Sperren des Blocks gewählt hast, kannst du den Block nicht entfernen oder verschieben. Du siehst ein Schlosssymbol in der Blocksymbolleiste und auch in der Listenansicht neben dem Block.

Um einen gesperrten Block zu entsperren, klicke auf das Drei-Punkte-Menü in der Block-Symbolleiste und wählen Sie „Entsperren“. Dadurch wird ein Dialogfeld geöffnet, in dem du die Optionen „Entfernen verhindern“ und/oder „Bewegung deaktivieren“ deaktivieren kannst.

Sobald du beide Optionen deaktivierst und auf „Übernehmen“ klickst, wird der Block entsperrt. Du wirst das Schlosssymbol in der Blocksymbolleiste und auch in der Listenansicht neben dem Block nicht mehr sehen.

Wenn du eine der beiden Optionen „Entfernen verhindern“ und/oder „Verschieben deaktivieren“ deaktivierst und auf „Übernehmen“ klickst, wird das Schlosssymbol in der Blocksymbolleiste und auch in der Listenansicht neben dem Block weiterhin angezeigt. Je nachdem, welche Option aktiviert ist, kannst du Block weder entfernen noch verschieben.

So entfernst du eine Sperre

Um einen Block zu entfernen, wähle den Block aus und klicke auf die drei Punkte in der Blocksymbolleiste für den Block. Unten im Menü findest du die Option zum Entfernen dieses Blocks.

Einen Block entfernen
Einen Block entfernen

So findst du einen Block oder ein Blockmuster

Der WordPress-Blockeditor bietet eine Reihe von Blöcken für jedes mögliche Element, das du Ihrer Site hinzufügen möchtest. Um die Liste der Blöcke zu durchsuchen , klicke auf  + Block Inserter  in der oberen linken Ecke des Editors.

Hier findest du alle Blöcke in Kategorien unterteilt. Wenn du mit der Maus über einen Block fahren, wird dir eine Vorschau des Blocks mit einer kurzen Beschreibung angezeigt. Wenn du auf eines der Blocksymbole klicken, wird es dem Beitrag oder der Seite hinzugefügt. Wenn du den Namen des Blocks kennen, kannst du im Suchfeld oben im Block-Inserter danach suchen.

Du kannst auch die für dein Design verfügbaren Blockmuster  (vordefinierte Blockgruppen) und die  synchronisierten Muster finden,  die du deiner Webseite hinzugefügt hast.

So findest du die am häufigsten verwendeten Blöcke

Du kannst die Einstellungen so festlegen , dass die am häufigsten verwendeten Blöcke oben in der Liste der Blöcke angezeigt werden, wenn du auf den Blockeinfüger klicken. Dies erleichtert dir die Auswahl aus den am häufigsten verwendeten Blöcken auf deiner Webseite.

Am häufigsten verwendete Blöcke
Am häufigsten verwendete Blöcke

So legest du fest, dass die am häufigsten verwendeten Blöcke oben in der Liste der Blöcke angezeigt werden:

  1. Klicke auf das Auslassungssymbol (die drei Punkte) in der oberen rechten Ecke des Editor-Bildschirms.
  2. Wähle  „Voreinstellungen“  >  „Blöcke“ .
  3. Aktiviere „Meistverwendete Blöcke anzeigen“.

Tipps zum Arbeiten mit Blöcken

Auswählen mehrerer Blöcke

Du kannst jetzt mehrere Blöcke auswählen, indem du den Inhalt innerhalb der Blöcke teilweise auswählst – mit der Maus (Ziehen), Umschalt + Klick und auch mit der Tastatur (Umschalt + Pfeil). Dies ist hilfreich, um mehrere Blöcke gleichzeitig zu verschieben oder zu transformieren, die Blockeinstellungen für mehrere Blöcke zu ändern, mehrere Blöcke zu gruppieren oder zu stapeln usw.

Verlinken zu einem bestehenden Beitrag oder einer bestehenden Seite

Du kannst schnell Links zu vorhandenen Beiträgen oder Seiten in deinen Inhalt einfügen. Gebe zwei offene Klammern  [[in Ihren Inhalt ein, um eine Liste von Beiträgen und Seiten anzuzeigen. Wähle dann aus der Liste den Beitrag oder die Seite aus, auf den/die du verlinken möchtest.

Erstellen von Mustern

Um zu vermeiden, dass du denselben Inhalt zu mehreren Beiträgen oder Seiten hinzufügst, kannst du einen Block oder eine Gruppe von Blöcken in einem  synchronisierten Muster speichern , das in jedem anderen Beitrag oder jeder anderen Seite wiederverwendet werden kann. Dies spart dir Zeit und Mühe. Z. B.: Kontaktinformationen, Geschäftszeiten, Social-Media-Konten, Call-to-Action-Button usw.

Erfahre hier mehr über synchronisierte Muster .

Gruppierungsblöcke

du kannst mehrere Blöcke in einer Gruppe zusammenfassen und als Einheit behandeln. Dies ist hilfreich, um eine Gruppe von Blöcken zu bearbeiten, zu formatieren (z. B. eine gemeinsame Hintergrundfarbe hinzufügen, die Schriftfarbe ändern usw.) oder zu verschieben. Wenn du sie nicht in einer Gruppe haben möchten, kannst du die Gruppierung deiner Blöcke auch aufheben.

Erfahre mehr über die Gruppierungsblöcke  .#

Log: 09.03.2025 Du Form

Task:

  • Screenshoot erneuern

How can we help?