--- url: 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/layout/verschachtelung' title: 'Ein verschachteltes Layout hinzufügen | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T08:39:23+00:00' updated: '2026-10-24T19:11:02+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'Sie können eine Zeile in eine Spalte setzen, um diese Spalte erneut zu teilen, etwa zwei Icons nebeneinander über einer Überschrift. Nutzen Sie das, wenn eine Spalte ein feineres Raster braucht als die Zeile darum. Das Beispiel fügt eine Zeile mit zwei Icons in die mittlere Spalte einer dreispaltigen Zeile ein. Für Ihre erste Zeile beginnen Sie mit Zeilen und Spalten.' tags: - 'Build on it' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T19:11:02+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Ein verschachteltes Layout hinzufügen' description: 'Sie können eine Zeile in eine Spalte setzen, um diese Spalte erneut zu teilen, etwa zwei Icons nebeneinander über einer Überschrift. Nutzen Sie das, wenn eine Spalte ein feineres Raster braucht als die Zeile darum. Das Beispiel fügt eine Zeile mit zwei Icons in die mittlere Spalte einer dreispaltigen Zeile ein. Für Ihre erste Zeile beginnen Sie mit Zeilen und Spalten.' image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T08:39:23+0000' dateModified: '2026-10-24T19:11:02+0000' author: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' mainEntityOfPage: 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/layout/verschachtelung' articleSection: 'Darauf aufbauen' - '@type': WebPage '@id': 'https://dxpr.com/de/hc/dokumentation/dxpr-builder-lernen/layout/verschachtelung' description: 'Sie können eine Zeile in eine Spalte setzen, um diese Spalte erneut zu teilen, etwa zwei Icons nebeneinander über einer Überschrift. Nutzen Sie das, wenn eine Spalte ein feineres Raster braucht als die Zeile darum. Das Beispiel fügt eine Zeile mit zwei Icons in die mittlere Spalte einer dreispaltigen Zeile ein. Für Ihre erste Zeile beginnen Sie mit Zeilen und Spalten.' breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: Startseite item: 'https://dxpr.com/de' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: de --- [Hilfe-Center](/de/hc)/[Dokumentation](/de/hc/dokumentation) /[DXPR Builder lernen](/de/hc/documentation/learn-dxpr-builder) /[Erweitern](/de/hc/documentation/learn-dxpr-builder/extend) /[Darauf aufbauen](/de/hc/documentation/learn-dxpr-builder/extend/build-on-it) # Ein verschachteltes Layout hinzufügen. DXPR Builder lernenErweiternDarauf aufbauen ## In diesem Leitfaden Verwandte Leitfäden - [Einen Positioned-Layers-Container hinzufügen](/de/hc/dokumentation/dxpr-builder-lernen/layout/positioned-layers) - [Eine Zeile hinzufügen](/de/hc/dokumentation/dxpr-builder-lernen/layout/zeilen-und-spalten) - [Ein Tabs-Panel hinzufügen](/de/hc/dokumentation/dxpr-builder-lernen/layout/tabs-element) Sie können eine Zeile in eine Spalte setzen, um diese Spalte erneut zu teilen, etwa zwei Icons nebeneinander über einer Überschrift. Nutzen Sie das, wenn eine Spalte ein feineres Raster braucht als die Zeile darum. Das Beispiel fügt eine Zeile mit zwei Icons in die mittlere Spalte einer dreispaltigen Zeile ein. Für Ihre erste Zeile beginnen Sie mit [Zeilen und Spalten](/de/hc/documentation/learn-dxpr-builder/layout/rows-and-columns). ## Ein verschachteltes Layout hinzufügen 1. Fügen Sie einen Abschnitt mit einer Zeile und Spalten hinzu. 2. Fahren Sie über eine Spalte und klicken Sie auf **+** in ihrer Column-Kontrollleiste. 3. Wählen Sie im Element-Picker **Row** aus dem Tab **Layout**. 4. Die verschachtelte Zeile erscheint in der Spalte mit eigenen Spalten. 5. Fügen Sie den verschachtelten Spalten wie gewohnt Elemente hinzu, zum Beispiel ein **Icon** in jeder. 6. Klicken Sie in der Symbolleiste auf **Save**, um die Seite zu speichern. Neue Elemente landen oben in ihrer Spalte, sodass die verschachtelte Zeile über dem Text der Spalte sitzt. ## Was Sie sehen Stift und Stern sitzen nebeneinander oben in der mittleren Spalte, über der Design-Überschrift. Die äußeren Spalten sind unverändert. Im Editor hat die verschachtelte Zeile eigene Row- und Column-Kontrollleisten, innerhalb derer der äußeren Zeile. ```text Section Row (1/3 + 1/3 + 1/3) Column Text: Discovery Column Row (nested, 1/2 + 1/2) Column Icon: pencil Column Icon: star Text: Design Column Text: Delivery ``` ## Ihr verschachteltes Layout einrichten Eine verschachtelte Zeile hat dasselbe Grid-Icon und dieselben Einstellungen wie jede Zeile; siehe [Zeilen und Spalten](/de/hc/documentation/learn-dxpr-builder/layout/rows-and-columns). Ihre Breiten sind Anteile der übergeordneten Spalte, nicht der Seite. Eine halb breite Spalte mit einer verschachtelten Zeile aus zwei Hälften ergibt zwei viertelbreite Bereiche. Auf Bildschirmen schmaler als 768 Pixel stapeln sich verschachtelte Spalten genau wie die äußeren. Geben Sie der verschachtelten Zeile mit **Add screen size** für Telefone ein eigenes Layout, wenn die Icons nebeneinander bleiben sollen. ### Maximale Verschachtelungstiefe Zeilen verschachteln sich drei Ebenen tief: eine Zeile, eine Zeile in einer ihrer Spalten und eine weitere Zeile darin. Eine vierte Ebene wird abgelehnt. Dasselbe Limit gilt für jeden Containertyp für sich, etwa Tabs in Tabs. Ein Typ zählt nie zum Limit eines anderen Typs. Zwei Ebenen decken die meisten Layouts ab. Jede weitere Ebene fügt Kontrollleisten hinzu, an denen vorbei Sie zielen müssen, und verengt den Platz für Inhalte. ### Häufige Verschachtelungsmuster | Muster | So wird es gebaut | |---|---| | Feature-Raster | Eine Zeile mit drei Spalten, jede mit einer verschachtelten Zeile: ein Icon neben seinem Text | | Seitenleisten-Blöcke | Eine 2/3 + 1/3-Zeile, deren schmale Spalte verschachtelte Zeilen enthält, eine pro Block | | Teammitglieder | Eine Zeile mit zwei Spalten, jede mit einer verschachtelten 1/3 + 2/3-Zeile: ein Porträt neben der Bio | ## Wenn Sie es nicht sehen - **Eine Warnung besagt, dass Sie Zeilen nur 3 Ebenen tief verschachteln können.** Die Spalte sitzt bereits in zwei verschachtelten Zeilen, daher „Element cannot be added“. Fügen Sie die Zeile in eine Spalte eine Ebene höher ein oder verwenden Sie ein Preset mit mehr Spalten in der äußeren Zeile. - **Die verschachtelte Zeile sitzt über dem Text statt darunter.** Neue Elemente landen oben in ihrer Spalte. Öffnen Sie **More** in der Kontrollleiste der verschachtelten Zeile und wählen Sie **Move Down**. - **Die Icons stapeln sich auf einem Telefon.** Verschachtelte Spalten stapeln sich unter 768 Pixeln wie alle Spalten. Klicken Sie auf das Grid-Icon der verschachtelten Zeile, dann auf **Add screen size**, und wählen Sie **1/2 + 1/2** für **Extra small (< 576px)**. ## Wie geht es weiter? - [Positioned layers](/de/hc/documentation/learn-dxpr-builder/layout/positioned-layers): Elemente so überlappen, wie es das Grid nicht kann. - [Zeilen und Spalten](/de/hc/documentation/learn-dxpr-builder/layout/rows-and-columns): Spalten-Presets und ein Layout pro Bildschirmgröße. - [Tabs](/de/hc/documentation/learn-dxpr-builder/layout/tabs-element): Inhaltspanele an einer Stelle stapeln statt nebeneinander.