Verschachtelte Blöcke sind eines der mächtigsten Features im WordPress-Blockeditor – und ihre Beherrschung kann Ihre Designs auf die nächste Stufe heben.
Sie ermöglichen es Ihnen, mehrere Elemente wie Absätze, Bilder und Schaltflächen in einem einzigen Layout zu gruppieren und zu organisieren. Sobald Sie verstehen, wie man sie benutzt, können Sie flexiblere, professionell aussehende Seiten erstellen, ohne auf zusätzliche Plugins oder benutzerdefinierten Code angewiesen zu sein.
Bei WPBeginner verwenden wir verschachtelte Blöcke seit ihrer Einführung und sie haben die Art und Weise, wie wir Seitenlayouts gestalten, komplett verändert. Sie erleichtern die Verwaltung komplexer Layouts und helfen dabei, einfache Inhalte in polierte, benutzerfreundliche Abschnitte zu verwandeln.
In dieser Anleitung führen wir Sie Schritt für Schritt durch die Auswahl und Verwendung von verschachtelten Blöcken in WordPress, damit Sie mit Zuversicht sauberere und effektivere Layouts erstellen können.

💡Wichtigste Erkenntnis: Was sind verschachtelte Blöcke?
Verschachtelte Blöcke sind einfach Blöcke, die innerhalb eines Container-Blocks wie einer Gruppe oder Spalte platziert werden. Sie ermöglichen es Ihnen, komplexe Seitenlayouts zu erstellen, Inhalte in Abschnitte zu organisieren und Stile auf mehrere Elemente gleichzeitig anzuwenden, ohne benutzerdefinierten Code verwenden zu müssen.
Was sind verschachtelte Blöcke in WordPress?
Die verschachtelte Blockfunktion von WordPress Gutenberg ermöglicht es Ihnen, einen oder mehrere Blöcke innerhalb eines anderen Blocks einzufügen (oder zu „verschachteln“).
Verschachtelte Blöcke helfen Ihnen, komplexere Layouts auf Ihrer WordPress-Website zu erstellen, indem Sie mehrere Blöcke ineinander verschachteln. Dies ermöglicht mehr Flexibilität beim Entwerfen und Formatieren von Inhalten für Seiten und Beiträge.
Sie können beispielsweise mehrere Bildblöcke innerhalb eines Gruppenblocks verschachteln, um eine Reihe von Fotos von einem bestimmten Ereignis oder eine Reihe von Kunstwerken anzuzeigen, die mit einer bestimmten Technik erstellt wurden.

Zusätzlich ermöglicht die verschachtelte Blockfunktion die separate Bearbeitung einzelner Blöcke. Dies ermöglicht es Ihnen, jeden Block nach Ihren Bedürfnissen anzupassen, ohne die anderen Blöcke zu beeinträchtigen.
Dies wiederum führt zu einer besseren Organisation von Inhalten, macht Inhalte attraktiver und optimiert den kreativen Prozess.
Nun, da wir das geklärt haben, sehen wir uns an, wie Sie WordPress Gutenberg-verschachtelte Blöcke einfach auswählen und verwenden können.
So verwenden Sie die verschachtelten Blöcke in WordPress
Sie können mehrere Blöcke einfach miteinander verschachteln, indem Sie den Gruppen- oder Spaltenblock im Gutenberg-Blockeditor verwenden.
Öffnen Sie zunächst einen vorhandenen oder neuen Beitrag im Block-Editor über die Seitenleiste der WordPress-Administration.
Klicken Sie von hier aus einfach auf die Schaltfläche „Block hinzufügen“ (+) in der oberen linken Ecke des Bildschirms und suchen Sie den Gruppenblock. Nachdem Sie darauf geklickt und ihn zur Seite hinzugefügt haben, müssen Sie ein Layout für die Blöcke auswählen, die Sie zusammen verschachteln möchten.
Für dieses Tutorial wählen wir das Layout „Gruppe“.

Klicken Sie dann einfach auf die Schaltfläche „+“ auf dem Bildschirm, um mit dem Hinzufügen von Inhalten innerhalb des übergeordneten Blocks zu beginnen.
Für dieses Tutorial fügen wir einen Bildblock hinzu.

Nachdem Sie den Block hinzugefügt haben, klicken Sie einfach auf die Schaltfläche „Gruppe“ in der Block-Symbolleiste oben, um den übergeordneten Block auszuwählen.
Als Nächstes musst du auf die Schaltfläche „+“ klicken, um das Blockmenü erneut zu öffnen, von wo aus du weitere Blöcke zum Hinzufügen auswählen kannst.

Konfiguration von verschachtelten Blockeinstellungen in WordPress
Sobald Sie mehrere Blöcke verschachtelt haben, können Sie deren individuelle Einstellungen konfigurieren, indem Sie auf jeden Block klicken. Von dort aus werden die Blockeinstellungen in der rechten Spalte des Bildschirms angezeigt.
Von hier aus können Sie die Hintergrundfarbe, Textfarbe und Größe der einzelnen Blöcke anpassen, ohne die anderen Blöcke zu beeinträchtigen, die darin verschachtelt sind.

Um die Einstellungen des Containers selbst zu konfigurieren, müssen Sie den übergeordneten Block auswählen. Dies können Sie tun, indem Sie auf das Symbol „Übergeordnetes Element auswählen“ in der Block-Symbolleiste klicken. Es sieht oft wie zwei gestapelte Quadrate aus.
Alternativ können Sie die Breadcrumbs-Leiste ganz unten im Editor verwenden, um auf den Namen des übergeordneten Elements wie „Gruppe“ oder „Spalten“ zu klicken.
Dies öffnet die Einstellungen des übergeordneten Blocks in der rechten Spalte. Sie können nun das Layout, die Hintergrundfarbe und die Typografie für den gesamten Abschnitt konfigurieren.

Beachten Sie, dass diese Einstellungen alle Blöcke beeinflussen, die innerhalb des übergeordneten Blocks verschachtelt sind, es sei denn, Sie haben für einen einzelnen inneren Block spezifische Stile angewendet.
Vorhandene Blöcke gruppieren
Sie können auch vorhandene Inhalte in verschachtelte Blöcke umwandeln. Dies ist oft schneller, als zuerst einen Gruppenblock zu erstellen und zu versuchen, ihn später zu füllen.
Wählen Sie einfach die Blöcke aus, die Sie kombinieren möchten. Dies können Sie tun, indem Sie mit der Maus klicken und ziehen oder indem Sie die Umschalttaste gedrückt halten und mehrere Blöcke auswählen.

Klicken Sie nach der Auswahl auf das Symbol „Gruppe“ in der Block-Symbolleiste.
WordPress wird Ihre ausgewählten Inhalte automatisch in einen Gruppenblock einfügen. Jetzt können Sie das Layout und den Hintergrund wie bei jedem anderen verschachtelten Abschnitt bearbeiten.

Wenn Sie zufrieden sind, vergessen Sie nicht, auf die Schaltfläche „Veröffentlichen“ oder „Aktualisieren“ zu klicken, um Ihre Änderungen zu speichern.
So sahen die verschachtelten Blöcke auf unserer Demowebsite aus.

Bonus: Verwenden Sie das Wayfinder-Plugin, um verschachtelte Blöcke einfach auszuwählen
Manchmal kann es schwierig sein, einen einzelnen Block auszuwählen und zu konfigurieren, wenn mehrere Blöcke miteinander verschachtelt sind.
Glücklicherweise macht das Wayfinder-Plugin die Auswahl von verschachtelten Blöcken aus einem übergeordneten Block super einfach und zeigt Ihnen sogar den Typ und die Klasse der Blöcke an.
Zuerst müssen Sie das Wayfinder Plugin installieren und aktivieren. Weitere Anweisungen finden Sie in unserem Anfängerleitfaden zur Installation eines WordPress-Plugins.
Gehen Sie nach der Aktivierung im Admin-Menü von WordPress zu Einstellungen » Wayfinder.
Sobald Sie dort sind, sind alle Einstellungen bereits aktiviert. Sie müssen lediglich das Kontrollkästchen neben den Einstellungen, die Sie nicht verwenden möchten, deaktivieren.
Wenn Sie beispielsweise möchten, dass Wayfinder Blocktypen für alle Blöcke im Editor anzeigt, lassen Sie das Feld neben der Option „Blocktyp anzeigen“ angekreuzt.

Wenn Sie jedoch nicht möchten, dass das Plugin Blockklassen anzeigt, deaktivieren Sie einfach das Kontrollkästchen neben dieser Option.
Vergessen Sie nicht, nach der Konfiguration der Einstellungen auf die Schaltfläche „Änderungen speichern“ zu klicken.
Als Nächstes müssen Sie im Dashboard einen vorhandenen oder neuen Beitrag im WordPress-Blockeditor öffnen.
Sobald Sie dort sind, zeigt das Überfahren eines inneren Blocks mit der Maus eine Umrandung mit seinem Namen an. Sie können auch die Umrandung und den Namen aller verschachtelten Blöcke innerhalb des übergeordneten Blocks sehen.

Dies hilft Ihnen, alle verschiedenen Blöcke zu identifizieren, die in einem Gruppen- oder Spaltenblock verschachtelt sind.
Von hier aus können Sie ganz einfach einen einzelnen Block aus dem übergeordneten Block auswählen, um seine Einstellungen zu konfigurieren.

Sie können auch alle verschachtelten Blöcke auf einmal auswählen, indem Sie auf die Überschrift „Spalten“ oder „Gruppe“ klicken. Dadurch werden die Einstellungen des übergeordneten Blocks in der rechten Spalte geöffnet.
Nach der Konfiguration der Blockeinstellungen klicken Sie einfach auf die Schaltfläche „Aktualisieren“ oder „Veröffentlichen“, um Ihre Änderungen zu speichern.

Häufig gestellte Fragen zu verschachtelten Blöcken
Hier sind einige Fragen, die unsere Leser häufig zu verschachtelten Blöcken gestellt haben:
Wie wählt man mehrere Blöcke in WordPress aus?
Um mehrere Blöcke auszuwählen, klicken Sie auf den ersten Block, halten Sie die Umschalttaste gedrückt und klicken Sie dann auf den letzten Block, den Sie auswählen möchten. Alternativ können Sie mit der Maus über die Blöcke ziehen, um sie alle auf einmal hervorzuheben.
Wie kombiniert man Blöcke in WordPress?
Sie können Blöcke kombinieren, indem Sie die spezifischen Elemente auswählen, die Sie zusammenführen möchten, und auf das Symbol Gruppieren (gestapelte Quadrate) in der Block-Symbolleiste klicken. Dies fasst sie in einem einzigen Container zusammen, sodass Sie sie als eine Einheit verschieben oder gestalten können.
Wie gruppiert man Blöcke zusammen?
Sie können Blöcke gruppieren, indem Sie sie hervorheben und in den Optionen der Symbolleiste Gruppieren auswählen. Dadurch wird ein übergeordneter Container erstellt, der die Blöcke organisiert und es Ihnen ermöglicht, eine Hintergrundfarbe oder einen Rahmen für den gesamten Abschnitt anzuwenden.
Was ist ein übergeordneter Block in WordPress?
Ein übergeordneter Block ist ein Container, wie z. B. ein Gruppen- oder Spaltenblock, der andere Blöcke enthält. Die darin enthaltenen Blöcke werden als „verschachtelte“ oder „untergeordnete“ Blöcke bezeichnet und erben in der Regel die Layout- und Stileinstellungen des übergeordneten Blocks.
Was ist ein Abstandhalter-Block in WordPress?
Ein Abstandhalter-Block ist ein Layout-Werkzeug, das verwendet wird, um einstellbaren leeren Raum zwischen anderen Blöcken hinzuzufügen. Es ermöglicht Ihnen, den vertikalen Abstand und den Freiraum zwischen Abschnitten zu steuern, ohne benutzerdefinierten Code schreiben zu müssen.
Was sind dynamische Blöcke in WordPress?
Dynamische Blöcke sind Blöcke, die Inhalte automatisch generieren, anstatt statisches HTML zu speichern. Beispiele hierfür sind die Blöcke „Neueste Beiträge“ oder „Kalender“, die sich sofort aktualisieren, wenn Sie neue Inhalte veröffentlichen oder die Website-Einstellungen ändern.
Was ist ein Trennlinien-Block in WordPress?
Ein Trennlinien-Block erzeugt eine visuelle Trennung zwischen Inhaltsabschnitten, die normalerweise als horizontale Linie dargestellt wird. Er hilft, lange Artikel in verschiedene Kapitel oder Themen zu unterteilen, um das Leseerlebnis zu verbessern.
Wir hoffen, dieser Artikel hat dir geholfen zu lernen, wie man verschachtelte WordPress-Blöcke auswählt und verwendet. Möglicherweise möchtest du auch unser Schritt-für-Schritt-Tutorial zum Thema Ändern der Blockhöhe und -breite in WordPress und unseren Leitfaden für Anfänger zum Thema Verwenden von WordPress-Blockmustern ansehen.
Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.


Christopher Molitor
Toller Artikel und DANKE für die Erwähnung von Wayfinder!
p.s. Version 1.1.7 veröffentlicht, um die Unterstützung für die neueste Version von WP hinzuzufügen.
WPBeginner Support
Glad you liked the article and glad we could share Wayfinder
Admin
kzain
Verschachtelte Blöcke scheinen ein Spielveränderer für die Erstellung einzigartiger Layouts auf meiner WordPress-Website zu sein! Die Drag-and-Drop-Funktionalität klingt super benutzerfreundlich. Ich liebe es, dass Sie jeden verschachtelten Block individuell anpassen können. Dies eröffnet so viele Möglichkeiten, ansprechende Website-Inhalte zu erstellen. Danke für diese hilfreiche Anleitung!
Ralph
Ich verwende verschachtelte Blöcke für ein Bild links und Text rechts und möchte, dass es so bleibt, nicht nur auf dem Desktop, sondern auch auf dem Handy, aber das tut es einfach nicht. Es platziert den Text unter dem Bild. Ist das normal für Mobilgeräte oder mache ich etwas falsch?
WPBeginner Support
Es würde vom Theme abhängen, aber es ist sehr üblich, dass dies auf Mobilgeräten geschieht, um sicherzustellen, dass der Text auf Mobilgeräten lesbar bleibt.
Admin
Jiří Vaněk
Dank dieser Artikel mache ich mich langsam mit Gutenberg vertraut. Ich bin sehr einfache Lösungen von Elementor gewohnt, und hier scheint alles etwas kompliziert oder eher ungewohnt für mich zu sein. Manchmal stoße ich jedoch auf Leute, die ausschließlich mit Gutenberg und nichts anderem Hilfe bei einer Website wünschen. Daher schätze ich diese Anleitungen, bei denen ich mich praktisch betätigen, Dinge ausprobieren und lernen kann, die für jemanden, der Gutenberg verwendet, vielleicht ganz alltäglich sind.