Der Divi Builder ist ein visueller WordPress Page Builder mit über 50 Modulen, der als eigenständiges Plugin mit jedem Theme funktioniert. Mit Divi 5 wurde der Builder komplett neu geschrieben – React-basiert und ohne das alte Shortcode-System – und liefert dadurch bis zu 4× schnellere Seiten und satte 84 % weniger JavaScript-Code.
Der Divi Builder IST NICHT das Divi Theme! Du kannst ihn als Plugin zu jedem beliebigen WordPress-Theme hinzufügen – Astra, GeneratePress, Twenty Twenty-Four, egal welches.
Builder vs. Theme – der Unterschied erklärt
Der Divi Builder ist ein Plugin, das du zu jedem WordPress-Theme hinzufügen kannst. Du installierst es wie jedes andere Plugin und hast dann einen visuellen Page Builder zur Verfügung.
Das Divi Theme ist ein komplettes WordPress-Theme, das den Builder bereits integriert hat. Wer das Theme nutzt, braucht das Plugin nicht zusätzlich.
Früher konnte man beides separat kaufen. Heute fokussiert sich Elegant Themes auf das integrierte Theme-Paket. Der Zugang zum Divi Builder erfolgt über die Elegant Themes Membership – die gibt’s ab 89 USD im Jahr oder als Lifetime-Lizenz für einmalig 249 USD, immer für unbegrenzte Websites (Details zu Preisen findest du in unserem separaten Artikel zum Divi Theme Kauf).
Der Builder mit anderen Themes – so funktioniert’s
Und hier wird’s spannant: Du kannst den Divi Builder mit praktisch jedem WordPress-Theme kombinieren!
Was funktioniert:
- Alle 50+ Module stehen dir zur Verfügung
- Visual Builder mit allen Ansichten läuft problemlos
- Global Elements und die Divi Library funktionieren
- Responsive Design-Tools sind voll nutzbar
Was du beachten musst:
- Das Theme bestimmt Header und Footer (außer du nutzt den Theme Builder)
- Globale Styles wie Schriften und Farben kommen vom Theme
- Manche Theme-Features können mit Divi-Modulen kollidieren
Der Divi Builder arbeitet am besten mit schlanken, neutralen Themes wie GeneratePress oder Astra. Bei Theme-Giganten mit eigenem Page Builder kann’s hakelig werden.
Divi Builder (-10 % Rabatt) kaufen
Der große Vorteil: Du bleibst flexibel! Wenn dir dein Theme nicht mehr gefällt, wechselst du das Theme – deine mit dem Divi Builder gebauten Seiten bleiben erhalten.
Ein Builder, viele Ansichten
Lange Zeit hatte Divi zwei getrennte Builder – einen Visual Builder fürs Frontend und einen Backend Builder im Dashboard. Mit Divi 5 ist damit Schluss: Es gibt jetzt einen einzigen, vereinheitlichten Builder, in dem du einfach zwischen mehreren Ansichten umschaltest.
Live-Ansicht (Frontend)
Du arbeitest direkt auf der Live-Website. Jeder Klick, jede Änderung ist sofort sichtbar. Echtes WYSIWYG ohne Umwege.
Die neue React-Version macht den Builder butterweich – keine Ladezeiten mehr zwischen Änderungen. Perfekt für Design-Arbeit, wenn du Farben, Schriften und Abstände feintunen willst.
Wireframe-Ansicht
Statt eines separaten Backend-Builders ist die Wireframe-Ansicht in Divi 5 einfach ein Umschalt-Modus. Du siehst eine schematische Darstellung deiner Inhalte. Keine Bilder, keine Farben – nur die pure Struktur.
Das ist Gold wert bei komplexen Layouts! Du behältst die Übersicht, kannst schnell viele Elemente gleichzeitig bearbeiten und arbeitest auch mit langsamer Internetverbindung flüssig.
Mit Divi 5 sind beide Modi verschmolzen. Du wechselst im selben Builder jederzeit zwischen Live-Vorschau, Wireframe-Ansicht und Zoom-Out für den Überblick über die ganze Seite.
Divi Builder (-10 % Rabatt) kaufen
Die Module im Detail
Der Divi Builder kommt mit einer massiven Modul-Bibliothek von über 50 Modulen. Hier sind sie kategorisiert und erklärt:
Content-Module (9 Stück)
Text-Modul
Der Standard für alle Textinhalte. Vollständiger Rich-Text-Editor mit allen Formatierungsoptionen, die du von WordPress kennst. Unterstützt Custom Fonts, Drop Caps, Textschatten und natürlich alle globalen Design-Einstellungen. Perfekt für Fließtext, Absätze und längere Inhalte.
Accordion-Modul
Aufklappbare Content-Bereiche, ideal für FAQs oder strukturierte Informationen. Jeder Accordion-Tab kann einzeln gestaltet werden. Du bestimmst, ob ein Tab standardmäßig geöffnet ist, ob mehrere Tabs gleichzeitig offen sein können und wie die Öffnen/Schließen-Animation aussieht. Icons sind vollständig anpassbar.
Toggle-Modul
Ähnlich wie Accordion, aber für einzelne Ein-/Ausklapp-Bereiche. Während Accordion mehrere zusammenhängende Tabs darstellt, ist Toggle für einzelne, unabhängige Bereiche gedacht. Gut für lange Seiten, bei denen du Content verstecken willst, der nicht für jeden relevant ist.
Tabs-Modul
Organisiere deinen Content in horizontalen oder vertikalen Tabs. Anders als Accordion/Toggle bleibt immer ein Tab sichtbar – du wechselst nur zwischen verschiedenen Content-Bereichen. Ideal für Produktbeschreibungen mit verschiedenen Aspekten (Features, Spezifikationen, Reviews).
Blurb-Modul
Eine Kombination aus Icon/Bild, Überschrift und Text – das Schweizer Taschenmesser für Feature-Auflistungen. Das Modul ist extrem vielseitig: Nutze es für Service-Boxen, Team-Member-Previews, Feature-Listen oder Vorteils-Darstellungen. Du kannst Icons, eigene Bilder oder sogar Zahlen als visuelles Element verwenden.
Call-to-Action-Modul
Vorgefertigte CTA-Boxen mit Überschrift, Text und Button. Das Modul kommt mit optimiertem Spacing und Layout für maximale Conversion. Hintergrund-Optionen sind umfassend: Volltonfarben, Verläufe, Bilder oder sogar Videos. Der Button ist vollständig in das Design integriert.
Button-Modul
Der hochgradig anpassbare Button. Wähle aus Dutzenden Hover-Effekten, definiere Border-Radius, nutze Icons links oder rechts vom Text, füge Box Shadows hinzu. Du kannst sogar zwei Buttons nebeneinander platzieren (Primary/Secondary). Perfekt für Download-Links, Kauf-Buttons oder Newsletter-Anmeldungen.
Testimonial-Modul
Kundenbewertungen mit Foto, Namen, Position und dem eigentlichen Zitat. Das Modul zeigt automatisch Anführungszeichen (anpassbar oder ausblendbar), unterstützt Sternebewertungen und lässt sich mit Background-Bildern oder -Farben individualisieren. Ideal für Social Proof auf Landing Pages.
Person-Modul
Teammitglieder-Darstellung mit Foto, Name, Position und Bio-Text. Social-Media-Icons können direkt integriert werden. Das Modul bietet verschiedene Layout-Optionen: Foto links/rechts/oben, zentriert oder in Kreis-Form. Perfekt für About-Us-Seiten oder Team-Vorstellungen.
Media-Module (6 Stück)
Image-Modul
Viel mehr als nur ein Bild einfügen! Das Modul bietet Overlay-Effekte beim Hover, Lightbox-Integration, Border und Box Shadow. Du kannst Bilder mit Links versehen, Alt-Texte für SEO definieren und verschiedene Hover-Animationen (Zoom, Slide, Fade) anwenden. Responsive Einstellungen ermöglichen unterschiedliche Bildgrößen pro Gerät.
Gallery-Modul
Responsive Bildergalerien in Grid- oder Slider-Layout. Wähle zwischen verschiedenen Spaltenanzahlen (1-4 Spalten), aktiviere Lightbox-Funktionalität und definiere Abstände zwischen Bildern. Das Modul unterstützt auch Pagination bei großen Galerien. Captions werden automatisch aus WordPress Media Library übernommen.
Video-Modul
Binde YouTube, Vimeo oder selbst-gehostete Videos ein. Das Modul bietet Custom Play-Buttons mit eigenen Designs, Overlay-Bilder die vor dem Abspielen gezeigt werden und automatische Responsive-Anpassung. Du kannst Videos auf Loop setzen, Autoplay aktivieren (vorsichtig damit!) und sogar Videos als Hintergrund nutzen.
Audio-Modul
Audio-Player für Podcasts, Musik oder Voice-Overs. Unterstützt MP3, WAV und andere gängige Formate. Der Player ist vollständig gestaltbar – Farben, Controls, Progress Bar, alles anpassbar. Ideal für Podcast-Websites oder Musiker-Portfolios. Das Modul kann auch mit SoundCloud oder Spotify integriert werden.
Video Slider-Modul
Ein Karussell mit Videos statt Bildern. Perfekt für Video-Portfolios, Tutorial-Serien oder Produkt-Demos. Du bestimmst Autoplay-Geschwindigkeit, Transition-Effekte und ob Controls sichtbar sind. Unterstützt sowohl externe (YouTube/Vimeo) als auch selbst-gehostete Videos in einem Slider.
Slider-Modul
Der klassische Bildkarussell mit Text-Overlays. Jede Slide kann eine Überschrift, Text, einen Button und ein Background-Bild haben. Automatisches Sliding mit einstellbarer Geschwindigkeit, verschiedene Transition-Effekte (Slide, Fade) und Parallax-Effekte für Backgrounds. Navigation mit Pfeilen oder Dots.
Formular-Module (4 Stück)
Contact Form-Modul
Vollständig anpassbare Kontaktformulare ohne Extra-Plugin! Du definierst beliebig viele Felder (Text, Email, Textarea, Checkboxen, Radio Buttons), legst fest welche Pflichtfelder sind und bestimmst die E-Mail-Empfänger. Das Modul hat eingebauten Spam-Schutz und lässt sich mit reCAPTCHA erweitern. Design ist komplett frei gestaltbar.
Email Opt-In-Modul
Newsletter-Anmeldungen mit direkter Integration zu MailChimp, AWeber, Constant Contact und vielen mehr. Du brauchst nur deinen API-Key und wählst die gewünschte Liste aus. Das Modul unterstützt Double-Opt-In, Success-Messages und Error-Handling. Ideal für Lead-Generation auf Landing Pages.
Login-Modul
Custom Login-Formulare für Mitglieder-Bereiche. Das Modul zeigt verschiedene Zustände: Logged-Out (Login-Formular), Logged-In (Custom Message und Logout-Link). Du kannst Redirect-URLs nach Login definieren und die Formular-Felder komplett stylen. Perfekt für Membership-Sites.
Comments-Modul
Der Kommentarbereich für Blogposts, aber mit Divi-Design-Kontrolle. Statt der Standard-WordPress-Kommentare gestaltest du das komplette Layout: Avatare, Namen, Datum, Reply-Buttons. Du bestimmst ob Kommentare genested dargestellt werden und wie viele Level tief. Gut für Blogs die Diskussionen fördern wollen.
Daten-Visualisierung (4 Stück)
Bar Counter-Modul
Animierte Balkendiagramme für Skills, Statistiken oder Umfrage-Ergebnisse. Die Balken füllen sich beim Scrollen in den Viewport – ein toller Effekt! Du definierst Prozent-Werte, Farben, Höhe und Beschriftungen. Mehrere Balken können gruppiert werden. Ideal für „Unsere Skills“-Sections oder Daten-Präsentationen.
Circle Counter-Modul
Kreisförmige Progress-Anzeigen mit animiertem Fortschritt. Das Modul zeigt einen sich füllenden Kreis mit Prozent-Anzeige in der Mitte. Du kannst Farben, Strichstärke und Größe bestimmen. Der Kreis füllt sich beim Scrollen – ein Eye-Catcher auf jeder Seite. Perfekt für Statistiken oder Achievement-Darstellungen.
Number Counter-Modul
Animierte Zahlen die von 0 bis zum Zielwert hochzählen. Klassischer Use Case: „1000+ zufriedene Kunden“, „50+ Jahre Erfahrung“. Die Animation startet beim Scrollen in den Viewport. Du kannst Präfixe (€, $) und Suffixe (+, Jahre) hinzufügen. Tausendertrennzeichen sind konfigurierbar.
Countdown Timer-Modul
Countdown zu einem bestimmten Datum/Uhrzeit. Zeigt Tage, Stunden, Minuten und Sekunden in Echtzeit an. Perfekt für Event-Ankündigungen, Produkt-Launches oder zeitlich begrenzte Angebote. Du kannst eine Custom Message definieren, die nach Ablauf des Countdowns erscheint. Design ist vollständig anpassbar.
Navigation & Struktur (5 Stück)
Menu-Modul
Custom Navigationsmenüs an jeder Stelle deiner Seite. Wähle ein WordPress-Menü aus und gestalte es komplett frei: Horizontal, vertikal, als Dropdown oder Mega-Menu. Icons können zu Menü-Items hinzugefügt werden. Das Modul ist vollständig responsive mit Mobile-Hamburger-Menü. Ideal wenn du das Theme-Menü nicht nutzen willst.
Divider-Modul
Visuelle Trenner zwischen Content-Bereichen. Mehr als nur eine Linie! Wähle aus verschiedenen Stilen: Durchgezogene Linie, gepunktet, gestrichelt oder komplett custom mit Bildern/Icons in der Mitte. Du kannst Farben, Breite und Höhe definieren. Auch als reines Spacing-Element nutzbar ohne sichtbare Linie.
Sidebar-Modul
Binde WordPress-Widget-Bereiche in deine Divi-Layouts ein. Das Modul zeigt alle registrierten Sidebars deines Themes an. Perfekt wenn du Theme-Widgets (z.B. Recent Posts, Tag Cloud) in custom Layouts integrieren willst. Das Design der Widgets kann über Custom CSS angepasst werden.
Map-Modul
Google Maps Integration mit mehreren Marker-Möglichkeiten. Zeige einen einzelnen Standort oder mehrere Locations auf einer Karte. Custom Marker-Icons, Info-Windows beim Klick und verschiedene Map-Styles (Standard, Grayscale, Custom). Du kannst auch den Zoom-Level und die initiale Kartenansicht bestimmen. Perfekt für Kontakt-Seiten oder Location-Finder.
Search-Modul
Suchformular mit Custom-Design. Statt der Standard-WordPress-Suche gestaltest du das komplette Formular: Input-Feld, Button, Placeholder-Text. Du kannst definieren ob die Suche in Posts, Pages oder Custom Post Types suchen soll. Das Modul ist vollständig responsive und kann als Icon (das sich öffnet) oder als permanentes Feld angezeigt werden.
Blog & Portfolio (6 Stück)
Blog-Modul
Zeige deine Blogposts in verschiedenen Layouts: Grid, Masonry, Full-Width oder als Liste. Du filterst nach Kategorien, Tags oder Autoren und bestimmst die Anzahl der Posts. Jeder Post zeigt Featured Image, Excerpt, Meta-Daten (Datum, Autor, Kommentare) und Read-More-Link. Pagination ist integriert. Das Modul ist komplett gestaltbar.
Portfolio-Modul
Portfolio-Grid für kreative Arbeiten. Ähnlich wie Blog, aber spezialisiert auf Portfolio-Items (ein Custom Post Type). Zeige Projekte in Grid-Layout mit Hover-Effekten. Du kannst nach Portfolio-Kategorien filtern und bestimmst Spaltenanzahl und Spacing. Perfekt für Designer, Fotografen, Agenturen.
Filterable Portfolio-Modul
Portfolio mit Click-Filtern! Über der Portfolio-Ansicht erscheinen Kategorie-Filter-Buttons. Besucher können mit einem Klick filtern welche Projekte sie sehen wollen – die Seite lädt nicht neu, es filtert per JavaScript. Ein absoluter Eye-Catcher für Portfolio-Seiten!
Post Navigation-Modul
Vor/Zurück-Navigation zwischen Blogposts. Zeigt „Vorheriger Post“ und „Nächster Post“ Links mit Thumbnails und Titeln. Das Modul kann oben oder unten auf Single-Post-Seiten platziert werden. Design ist frei gestaltbar: Horizontal, vertikal, nur Pfeile oder mit vollem Post-Info.
Post Title-Modul
Zeigt den Titel des aktuellen Posts dynamisch an. Das Modul ist für Single-Post-Templates im Theme Builder gedacht. Du kannst entscheiden ob auch Meta-Daten (Autor, Datum, Kategorien) angezeigt werden. Styling ist komplett frei: Schriftgröße, Farbe, Alignment.
Post Slider-Modul
Ein Slider der automatisch deine neuesten Blogposts zeigt. Jede Slide enthält Featured Image, Titel, Excerpt und Link zum vollen Post. Du filterst nach Kategorien und bestimmst wie viele Posts gezeigt werden. Autoplay und Transition-Effekte sind konfigurierbar. Ideal für Blog-Homepages.
Social Media (2 Stück)
Social Media Follow-Modul
Follow/Like-Buttons für all deine Social-Media-Kanäle. Unterstützt Facebook, Twitter, Instagram, LinkedIn, YouTube, Pinterest und viele mehr. Die Icons sind entweder als offizielle Branded-Buttons oder als Custom-gestaltete Icons darstellbar. Du kannst Icon-Größe, Spacing und Hover-Effekte bestimmen. Zähler für Follower/Likes können optional angezeigt werden.
Social Media Share-Modul
Share-Buttons für die aktuelle Seite. Besucher können den Content auf Facebook, Twitter, LinkedIn, Pinterest etc. teilen. Die Buttons können als Icons, als Icons mit Text oder als Full-Width-Buttons dargestellt werden. Du wählst welche Netzwerke angezeigt werden. Share-Counts sind optional verfügbar.
Spezial-Module
Code-Modul
Hier wird’s technisch! Füge HTML, CSS und JavaScript direkt ein. Das Modul hat Syntax-Highlighting für bessere Lesbarkeit. Du kannst Third-Party-Embeds (Calendly, Typeform, etc.), Custom-Kalkulatoren, interaktive Charts oder API-Integrationen einbauen. Das Modul führt den Code unverändert aus – nur Code einfügen, dem du vertraust!
Neu in Divi 5 (6 Module)
Mit Divi 5 sind ein paar lang ersehnte Module endlich nativ dabei – früher brauchtest du dafür Third-Party-Plugins:
Group-Modul
Fasse mehrere Module zu einer Gruppe zusammen und style sie gemeinsam – Background, Spacing und Hover-Effekte gelten dann für die ganze Gruppe. Ein Riesen-Workflow-Boost bei verschachtelten Layouts.
Table of Contents-Modul
Automatisches Inhaltsverzeichnis aus deinen Überschriften. Perfekt für lange Blogposts und Ratgeber – ganz ohne Extra-Plugin.
Breadcrumbs-Modul
Navigationspfad als eigenständiges Modul, frei platzierbar und voll gestaltbar. Gut für Orientierung und Struktur.
Timeline-Modul
Chronologische Darstellungen für Firmengeschichte, Prozessschritte oder Roadmaps – vertikal oder horizontal.
SVG-Modul
Binde skalierbare Vektorgrafiken sauber ein und animiere sie sogar. Knackscharf auf jedem Display.
Instagram Feed-Modul
Zeig deinen aktuellen Instagram-Feed direkt auf der Seite – automatisch aktualisiert.
WooCommerce-Module (16+ Stück)
Wenn du einen WooCommerce-Shop betreibst, kommen noch 16 spezialisierte Module dazu:
Product-Anzeigemodule
Product Title: Dynamischer Produkttitel
Product Images: Produktbilder mit Galerie
Product Price: Preis mit Sale-Anzeige
Product Rating: Sterne-Bewertung
Product Stock: Verfügbarkeit
Product Meta: SKU, Kategorien, Tags
Shop-Funktionsmodule
Add to Cart: In-den-Warenkorb-Button
Product Description: Kurz- oder Langbeschreibung
Product Tabs: Features/Specs/Reviews in Tabs
Related Products: Ähnliche Produkte
Upsells: Cross-Selling-Vorschläge
Product Reviews: Kundenbewertungen
Navigation & Struktur
Breadcrumbs: Navigationspfad
Product Additional Information: Zusatzinfos
Product Data Tabs: Erweiterte Info-Tabs
Diese Module machen den Divi Builder zu einem der besten Page Builder für WooCommerce. Du kannst Produkt-Seiten komplett custom gestalten ohne ein einziges Template anfassen zu müssen!
Design-Kontrolle auf allen Ebenen
Jedes Modul im Divi Builder hat drei Einstellungs-Tabs:
Content: Dein eigentlicher Inhalt (Text, Bilder, Links)
Design: Hier wird’s interessant! Background (Farben, Verläufe, Bilder, sogar Videos), Typography (Schriften, Größen, Abstände), Spacing (Padding und Margin für alle 4 Seiten), Border & Box Shadow, CSS-Filter (Blur, Brightness, Grayscale), Transforms (Rotate, Scale, Skew), Animationen (7 verschiedene Typen)
Advanced: Custom CSS mit Syntax-Highlighting, Responsive Visibility (zeig/versteck Elemente pro Gerät), Scroll Effects (6 verschiedene Typen), Conditional Display (zeig Inhalte nur unter bestimmten Bedingungen), Position & Z-Index
Global Presets – dein Design-System
Du kannst für jedes Modul im Divi Builder mehrere Standard-Styles speichern. Zum Beispiel drei Button-Presets: „Primary“, „Secondary“, „Ghost“.
Mit einem Klick wendest du den Preset an. Änderst du später den Preset, aktualisiert sich das überall wo er genutzt wird!
Das ist ein komplettes Design-System innerhalb vom Divi Builder.
Responsive Design: 7 Breakpoints statt 3
Hier hebt sich der Divi Builder von der Konkurrenz ab: Die neue Version bietet 7 anpassbare Breakpoints statt der üblichen 3.
Drei davon sind standardmäßig aktiv (Phone, Tablet, Desktop), die anderen vier schaltest du bei Bedarf dazu. Und du kannst die Pixel-Werte für jeden Breakpoint selbst definieren: Ultra Widescreen, Widescreen, Desktop, Tablet Wide, Tablet, Phone Wide und Phone.
Fast jede Einstellung lässt sich pro Gerät separat einstellen. Schriftgröße auf Desktop 48px, auf Mobile 24px? Kein Problem! Zusätzlich kannst du Column Orders pro Gerät ändern, Elemente nur auf bestimmten Geräten zeigen und verschiedene Backgrounds für Desktop vs. Mobile nutzen.
Workflow-Features für Profis
Keyboard Shortcuts: Die wichtigsten sind Cmd/Ctrl + S (Speichern), Cmd/Ctrl + D (Duplizieren), Cmd/Ctrl + C/V (Copy/Paste), Cmd/Ctrl + Shift + C/V (nur Styles kopieren).
Cross-Page Copy/Paste: Du kannst Elemente von einer Seite kopieren und auf einer komplett anderen Seite einfügen. Funktioniert sogar zwischen verschiedenen Websites!
Global Elements: Markiere ein Element als „global“ und es wird überall synchronisiert. Änderst du es an einer Stelle, updated es automatisch auf allen Seiten.
Divi Library: Speichere Module, Reihen, Sections oder ganze Layouts zur Wiederverwendung. Plus: 300+ vorgefertigte Layouts von Elegant Themes.
Divi Cloud: Cloud-Speicher für deine Assets, zugänglich von allen deinen Websites (Teil des Divi Pro Bundles).
Erweiterte Features die beeindrucken
Scroll Effects – 6 verschiedene Animationen
Der Divi Builder bietet 6 verschiedene Typen von Scroll-Animationen:
- Vertical Motion: Parallax-Effekt für vertikale Bewegungen
- Horizontal Motion: Seitliche Bewegungen beim Scrollen
- Fade In/Out: Ein- und Ausblenden von Elementen
- Scale: Vergrößern oder verkleinern von Elementen
- Rotate: Rotations-Animationen
- Blur: Unschärfe-Effekte
Du konfigurierst alles visuell – wann die Animation startet, wie stark sie ist, wie schnell sie reagiert.
Hover-Optionen – volle Kontrolle über Interaktionen
Fast alle Einstellungen haben einen separaten Hover-Tab. Definiere wie sich ein Element beim Hovern verändert: Farbe, Größe, Filter, Position – alles möglich.
Divi AI – dein KI-Assistent im Builder
Seit Divi 5 ist Divi AI direkt im Builder eingebaut. Die KI schreibt dir Texte, generiert Bilder und baut auf Wunsch sogar ganze Layouts – alles, ohne den Builder zu verlassen. In der Standard-Membership sind die Prompts begrenzt, im Divi Pro Bundle nutzt du Divi AI unbegrenzt.
Divi Quick Sites – komplette Website per KI
Noch einen Schritt weiter geht Quick Sites: Du beschreibst dein Business in ein paar Sätzen, und die KI baut dir eine komplette Website samt Seitenstruktur, Texten und Bildern. Das Feintuning machst du danach im Builder. Quick Sites ist Teil des Divi-Pro-Plans.
Theme Builder – globale Templates für alles
Mit dem Theme Builder erstellst du globale Templates für Header, Footer, Blog-Posts, Archive-Seiten und mehr. Ein Template, alle Posts nutzen es automatisch.
Das macht den Divi Builder zu einem echten Site Builder, nicht nur Page Builder.
Divi Builder (-10 % Rabatt) kaufen
Performance: Komplett neu geschrieben und drastisch schneller
Divi 5 wurde von Grund auf neu geschrieben. Das alte Shortcode-System ist komplett verschwunden – darunter lief die Seite jahrelang voller [et_pb_…]-Codes. Stattdessen baut Divi 5 jetzt auf eine moderne, Gutenberg-ähnliche Struktur mit Flexbox und CSS Grid. Bestehende Divi-4-Seiten laufen dank Abwärtskompatibilität trotzdem einfach weiter.
Und das merkst du knallhart bei der Performance:
| Metrik | Divi 4 vs. Divi 5 |
|---|---|
| JavaScript | ~276 KB → ~45 KB (−84 %) |
| CSS | ~94 % weniger Code |
| Server-Processing | 40–80 % schneller |
| Ladezeit | Seiten 2–4× schneller |
| PageSpeed | 100/100 möglich (out of the box), TBT 0 ms |
| Architektur | React-basiert (komplett neu geschrieben) |
| Module-Loading | Dynamic Module Framework (nur genutzte Module) |
| CSS-Generierung | Dynamic + Static CSS Files |
Seiten laden damit bis zu 4× schneller – und das oft komplett ohne zusätzliches Caching-Plugin.
Divi 5 bringt seine eigene dynamische CSS/JS-Optimierung schon mit – ein Caching-Plugin (WP Rocket ist solide) brauchst du also nur noch optional. Optimiere zusätzlich Bilder mit WebP-Format und Komprimierung, investiere in gutes Hosting und hoste Fonts lokal statt von Google.
Fazit: Ein ausgereiftes Profi-Tool
Der Divi Builder ist längst kein „Anfänger-Tool“ mehr, sondern ein professionelles Design-System. Die Performance-Revolution durch die neue Architektur macht frühere Kritikpunkte obsolet.
Der große Vorteil: Du kannst den Divi Builder mit jedem WordPress-Theme kombinieren und bleibst damit flexibel. Gefällt dir dein Theme nicht mehr? Wechsel es – deine mit dem Divi Builder gebauten Seiten bleiben erhalten.
Vorteile:
- Über 50 Module: Decken praktisch jeden Use Case ab – von einfachen Blogposts bis zu komplexen WooCommerce-Shops
- Theme-unabhängig: Funktioniert mit jedem WordPress-Theme und macht dich flexibel
- Vereinheitlichter Builder: Live-Vorschau, Wireframe und Zoom-Out in einem – jederzeit umschaltbar
- Performance: Bis zu 4× schnellere Seiten, 84 % weniger JavaScript, 100/100 PageSpeed möglich
- Divi AI & Quick Sites: Texte, Bilder und ganze Websites per KI direkt im Builder
- Unbegrenzte Websites: Besonders attraktiv für Freelancer und Agenturen mit mehreren Projekten
- 7 Responsive Breakpoints: Mehr Kontrolle als die meisten anderen Builder
- Global Elements & Presets: Konsistentes Design über alle Seiten hinweg
Nachteile:
- Lernkurve: Die Fülle an Optionen kann anfangs überwältigend sein
- Elegant Themes Membership erforderlich: Der Builder ist nicht mehr separat erhältlich
- Theme-Kollisionen möglich: Bei komplexen Themes mit eigenen Buildern kann es zu Konflikten kommen
Die Kombination aus visueller Arbeitsweise, technischer Tiefe und unbegrenzten Websites macht den Divi Builder besonders für Freelancer und Agenturen interessant, die mehrere Projekte gleichzeitig betreuen. Wer nach Alternativen sucht, sollte sich auch Elementor oder andere WordPress Page Builder ansehen.
Divi Builder (-10 % Rabatt) kaufen
Mehr Details zu Preisen und Lizenzmodellen findest du in unserem Artikel zum Divi Theme Kauf.
