Die Sektion ist die oberste Ebene im Divi-Aufbau. Jede Sektion ist ein waagerechter Streifen deiner Seite und kann eine oder mehrere Zeilen enthalten. Ihr Hintergrund reicht von Rand zu Rand, deshalb markierst du mit Sektionen die Bereiche deiner Seite: Kopfbereich, Leistungen, Kontakt.
Ich gehe die Sektion durch: Aufbau, einfügen, Hintergrund, Abstand und die gewellten Übergänge zwischen zwei Sektionen. Getestet mit Divi 5 (Version 5.13, deutsche Oberfläche), Stand Oktober 2026. Für die Zeilen in der Sektion gibt es eine eigene Anleitung: Zeilen in Divi 5.
Eine Änderung gegenüber Divi 4: Früher konntest du beim Einfügen zwischen Standard-, Vollbreite- und Spezial-Sektion wählen. Im Einfügen-Fenster von Divi 5.13 fand ich diese Auswahl nicht. Es gibt dort nur „Neuer Abschnitt“ und „Aus Bibliothek hinzufügen“, danach wählst du ein Spaltenlayout.
Sektion auswählen und die Leiste
Fahr im Visual Builder mit der Maus über eine Sektion, am besten auf einen freien Bereich außerhalb der Zeile. Dann erscheint ein blauer Rahmen mit einer kleinen Leiste oben links. (Die grüne Leiste gehört zur Zeile.)
Blaue Leiste für die Sektion, grüne Leiste für die Zeile darin.
Die vier Symbole heißen von links nach rechts „Sektion Einstellungen“ (Zahnrad), „Sektion Duplizieren“, „Sektion Löschen“ und „Weitere Optionen“. Hinter den drei Punkten liegt ein Menü, das fast dem der Zeile gleicht:
Das Menü der Sektion: duplizieren, löschen, sperren, kopieren und in die Bibliothek speichern.
Nützlich sind „Sektion Sperren“ für fertige Bereiche und „In Bibliothek Speichern“, wenn du einen Bereich auf mehreren Seiten brauchst.
Neue Sektion einfügen
Am unteren Rand jeder Sektion sitzt ein blaues Plus. Ein Klick öffnet das Fenster „Abschnitt einfügen“. Hier nennt Divi die Sektion „Abschnitt“, im Einstellungsfeld aber „Sektion“. Gemeint ist dasselbe.
Im Fenster „Abschnitt einfügen“ wählst du gleich das Spaltenlayout mit.
Ich habe das zweite Layout unter „Gleiche Spalten“ gewählt (zwei gleich breite Spalten). Divi legt unter der ersten eine zweite Sektion mit einer leeren Zeile an. Jede Spalte hat ein eigenes Plus für das erste Modul.
Neue Sektion mit leerer Zeile unter der bestehenden.
Hintergrund der Sektion
Klick auf das Zahnrad der Sektion. Rechts öffnet sich das Einstellungsfeld „Sektion“ mit den Reitern „Inhalt“, „Design“ und „Erweitert“. Unter „Inhalt“ öffnest du die Gruppe „Hintergrund“, klickst in „Farbe Auswählen“, tippst einen Hex-Wert wie #fdf0e6 und bestätigst mit Enter.
Der Hintergrund steht im Reiter „Inhalt“.
Neben der Farbe bietet die Gruppe Verlauf, Bild, Video, Muster und Maske an. Der Hintergrund füllt die gesamte Breite der Sektion, unabhängig von der Zeilenbreite.
Abstand oben und unten
Im Reiter „Design“ öffnest du „Zwischenraum“. Dort stehen zwei Blöcke untereinander:
- Außenabstand: Platz außerhalb der Sektion, der Hintergrund bleibt davon unberührt
- Innenabstand: Platz innerhalb, zwischen dem Rand der Sektion und dem Inhalt
Stolperfalle: Der Block „Außenabstand“ steht oben. Mein erster Versuch landete deshalb im falschen Feld, die farbige Fläche blieb gleich groß und rutschte nur auseinander. Für mehr Luft im farbigen Bereich trägst du die Werte unter „Innenabstand“ ein. Ich habe bei Oben und Unten jeweils 60 eingegeben und mit Tab bestätigt.
Innenabstand oben und unten je 60 Pixel.
Der farbige Bereich ist höher geworden, der Text hat Luft.
Wellen und Schrägen zwischen Sektionen
Unter „Design“ gibt es die Gruppe „Übergänge“. Sie schneidet die Kante der Sektion in eine Form, statt in einer geraden Linie zu enden.
- Öffne „Übergänge“. Oben stehen die zwei Schalter „Oben“ und „Unten“. Wähl die Kante, die du formen willst.
- Klick auf das Feld „Übergangsstil“. Es klappt eine Liste mit Formen auf, oben steht „Keine“, darunter folgen Wellen, Dreiecke, Kurven und Zacken als kleine Vorschaubilder.
Die Liste der Formen, jeweils als Bild.
Ich habe unten eine Kurve gewählt. Danach erscheinen weitere Felder: „Übergangsfarbe“, „Übergangshöhe“ (Standard 100 px), „Übergang Horizontal Wiederholen“, „Übergang Umkehren“ und „Übergang Positionieren“ (Vorgabe „Unter dem Inhalt“).
Nach der Wahl der Form folgen die Feinheiten.
Die untere Kante der Sektion läuft jetzt als Kurve aus.
Ohne eigene Übergangsfarbe war die Fläche unter der Kurve bei mir weiß, so wie der Seitenhintergrund. Über „Übergangsfarbe“ legst du sie fest, etwa passend zur nächsten Sektion. Vergiss am Ende nicht, oben rechts auf „Speichern“ zu klicken.
Weitere Einstellungen
Unter „Größe Einstellen“ stehen unter anderem „Mindesthöhe“, „Höhe“ und „Seitenverhältnis“. Mit einer Mindesthöhe machst du Kopfbereiche groß, ohne Leerzeilen zu bauen. Im Reiter „Erweitert“ findest du „Sichtbarkeit“, „CSS (Standbild)“ und „Scroll-Effekte“.
Meine Empfehlung: Eine Sektion pro Themenblock, den Hintergrund auf der Sektion setzen, den Abstand über den Innenabstand regeln. Das hält die Seite übersichtlich. Divi bekommst du bei Elegant Themes (Werbung).
