Divi ist ein kommerzielles Theme für WordPress, welches einen PageBuilder mitbringt mit dem Anwender schon lange vor Gutenberg in der Lage waren, das Layout ihrer Websites an eigene Wünsche anzupassen. Es wird seit 2013 von Elegant Themes entwickelt. Die aktuelle Version 4 wurde am 17. Oktober 2019 veröffentlicht. Laut verschiedenen Marktanalysen liegt der Marktanteil des Themes 2026 bei 0.1 Prozent aller WordPress-Installationen, obwohl sie sich selbst als „Meistgenutztes Theme der Welt“ bezeichnen. Und tatsächlich habe ich das Gefühl, es dürften mehr Prozente am Marktanteil sein. Das ist durchaus ein Grund sich das neue Divi 5 anzuschauen.
Disclaimer
DIVI ist ebenfalls die Abkürzung für den Deutsche Interdisziplinäre Vereinigung für Intensiv- und Notfallmedizin (DIVI) e.V. Diese Organisation setzt sich für die Förderung der Intensivmedizin und Notfallmedizin in Deutschland ein und hat keinerlei Berührungspunkte mit dem WordPress-Theme Divi.
Dieser Beitrag richtet sich an interessierte WordPress-Entwickler.
Das eigene Erleben
Ich kam vor einigen Jahren über meine Arbeit in den WordPress.org Supportforen erstmals mit Divi aus Sicht eines Besuchers in Berührung. Es erschien mir zunächst wie jeder PageBuilder: der Anwender hat Möglichkeiten zur Gestaltung seiner Website und nutzt diese auch. Soweit so gut.
Als ich dann mal eine Lizenz in die Finger bekam, schaute ich mir das Ganze im Backend an. Zunächst versuchte ich einfach eine Seite zu bearbeiten und hatte eine Mikroenttäuschung1: der Editor lädt sich 2 Mal. Er braucht bei mir rund 30 bis 50 Sekunden um geladen zu sein. Und das jedes Mal, wenn ich ihn öffne. Wie ich später herausfand, ist das ein Manko von Divi über das zum Einen in diversen Kreisen schon Witze gerissen werden, zum Anderen es Elegant Themes aber durchaus als Problem bewusst ist.
Die ersten Arbeiten aus Entwicklersicht
Für mein Plugin Personio Integration habe ich schon sehr früh versucht eine native Unterstützung in Divi für die Ausgabe von offenen Stellen zu ergänzen. Daher hatte ich (wie bei jedem anderen PageBuilder auch) folgendes auf meiner ToDo-Liste stehen:
- Erstellung von Widgets (in Divi Module genannt) zu den verschiedenen Ausgabethemen (z.B. die Ausgabe der Stellenbeschreibung).
- Erstellung von Templates in Divi für die Ausgabe der Stellen als Archive und Single-Ansicht.
Ich fand eine Anleitung für die Erstellung individueller Module für Divi und war erstaunt: Divi arbeitet, so wie auch Gutenberg, mit React. Gleichzeitig aber binden sie die Module mit aufwendigen PHP-Klassen ein, ähnlich wie es übrigens Bricks oder Elementor auch machen (nur dort eben ohne React). Insgesamt musste ich pro Modul 3 Dateien erstellen, wie im Bild hier zu sehen ist, sowie die Einbindung über eine weitere Datei regeln.
Es gibt auch ein yum-Script zum Kompilieren, was ich erst nach einigen Monaten mit npm, welches ich im gleichen Plugin für Gutenberg-Blöcke einsetze, kompatibel machen konnte. Herausforderung hierbei sind vor allem die Versionsunterschiede gewesen. Während ich Gutenberg Blöcke jederzeit mit dem aktuellsten npm generieren lassen kann, muss man für Divi 4 npm 14 verwenden.
Eine weitere Hürde waren die PHP-Dateien, die seitens Divi 4 für die Einbindung von Modulen erforderlich sind. Diese entsprechen nicht den WordPress Coding Standards, erfüllen auch nicht die Regeln von PHPStan und konnte ich auch nicht anpassen, da Divi 4 ansonsten einen Fehler meldete. Da meine Plugins für die Erstellung jedes einzelnen Releases damit kompatibel sein müssen, habe ich hierfür Ausnahmen einrichten müssen. Alles was Divi 4 betrifft, liegt nicht im gleichen Verzeichnis wie die PHP-Dateiem vom restlichen Plugin und wird dadurch völlig ignoriert.
Die Einarbeitungszeit für die nativen Divi 4 Module, war bei Divi 4 mit mehreren Tagen bereits erheblich. Zum Vergleich: bei Elementor war ich innerhalb von 2 Stunden in der Lage mein erstes Widget bereitzustellen und hatte nach einem Tag insgesamt 18 Widgets erstellt.
Divi 5 – alles wird besser?
Irgendwann vor 2 Jahren las ich, dass Elegant Themes bereits seit 2022 an Divi 5 arbeitet. Es sollte sich um eine komplette Überarbeitung des Themes handeln, das verspricht zumindest der Slogan auf dieser Website: https://www.elegantthemes.com/divi-5/
Eine erste Demo habe ich Anfang letzten Jahres gesehen und war total begeistert. Die Oberfläche ist, anders als Divi 4, modern, übersichtlich und mit Möglichkeiten gespickt, die andere PageBuilder zu dem Zeitpunkt noch nicht hatten (z.B. eine Klassenverwaltung). Und offenbar lädt er auch nur noch ein Mal – ganz wichtig :) Ich freute mich neben den anderen PageBuildern für von mir betreute Websites, möglicherweise noch einen weiteren brauchbaren zur Verfügung zu haben und vlt. in Zukunft von der umständlichen Divi 4 Unterstützung Abschied nehmen zu können.
Der Realitätsschock
Anfang Februar 2026 nutzte ich auf Grund mehrerer Anfragen zur nativen Divi 5 Unterstützung für meine Plugins die Chance, mir eine aktuelle Divi Lizenz zu kaufen und damit dann zum Einen Divi 5 zu testen und zum Anderen auch wieder eigene Module dafür bereitzustellen. Die Vorfreude wich einem anderen Gefühl, was ich nun versuche zu beschreiben.
Disclaimer: alles hier beschriebene basisert auf Divi 5 in Version beta.8.2.
Ich habe, wie immer, ein neues WordPress-Projekt eingerichtet und Divi 5 darin als Theme installiert. Lizenz eingegeben, alles gut. Ich musste schmunzeln, als ich merkte, dass „Dashboard“ weiterhin mit „Amaturenbrett“ übersetzt wird. Dann habe ich direkt den Editor bei einer neuen Seite geöffnet. Der sah schon größtenteils so aus wie in der Demo. Unter zahlreichen Icons auf der linken Seite verstecken sich teils umfangreiche Möglichkeiten um die Website zu verändern. Und rechts hat man dann zu der aktuell getroffenen Auswahl passende Optionen. Das ähnelt schon anderen bekannten PageBuildern.
Ich habe ein bischen mit den in Divi 5 enthaltenen Modulen getestet, Texte eingefügt, etwas Styling probiert etc. Fühlt sich auf Sicht eines Anwenders schon ganz gut an und erlaubt ein flüssiges Arbeiten.
Als WordPress-Entwickler schaut man sich aber natürlich auch an was dahinter passiert. Und ich wurde erstaunt – aber nicht im positiven Sinn. Kurz gesagt:
Divi 5 ist eine Art neue grafische Oberfläche für den Gutenberg Editor ohne dessen Funktionen und Möglichkeiten zu verwenden.
Schau euch das Bild oben an. In post_content schlägt sich das so nieder:
<!-- wp:divi/placeholder --><!-- wp:divi/section {"builderVersion":"5.0.0-public-beta.7.4"} -->
<!-- wp:divi/row {"module":{"advanced":{"flexColumnStructure":{"desktop":{"value":"equal-columns_1"}}},"decoration":{"layout":{"desktop":{"value":{"flexWrap":"nowrap"}}}}},"builderVersion":"5.0.0-public-beta.8.2"} -->
<!-- wp:divi/column {"module":{"decoration":{"sizing":{"desktop":{"value":{"flexType":"24_24"}}}}},"builderVersion":"5.0.0-public-beta.8.2"} -->
<!-- wp:divi/text {"content":{"innerContent":{"desktop":{"value":"\u003cp\u003eHier steht Ihr Inhalt. Bearbeiten oder entfernen Sie diesen Text direkt hier oder in den Inhaltseinstellungen des Moduls. Sie können außerdem jedes Detail dieses Inhalts in den Designeinstellungen des Moduls gestalten und sogar benutzerdefiniertes CSS in den erweiterten Einstellungen anwenden.\u003c/p\u003e"}}},"builderVersion":"5.0.0-public-beta.8.2"} /-->
<!-- /wp:divi/column -->
<!-- /wp:divi/row -->
<!-- /wp:divi/section --><!-- /wp:divi/placeholder -->Ja, ihr seht richtig. Das sind individuelle Gutenberg Blöcke. Und ja, kann man ja so machen. Es gibt auch andere Plugins, die die Möglichkeiten von Gutenberg erweitern. Divi 5 ersetzt diese jedoch mit seiner eigenen Oberfläche. Hier kam bei mir zuerst ein dickes Fragezeichen in den Kopf.
Dann prüfte ich, ob ich die ohnehin im Personio Integration Plugin vorhandenen Gutenberg Blöcke verwenden kann. Leider nein. Also schaute ich, wie individuelle Module (oder sind es doch Blöcke?) für Divi 5 aussehen müssten. Leider gibt es bis heute keine Anleitung seitens Elegant Themes hierfür. Daher blieb mir nur eine längere Recherche – und nein: KI hilft hier gar nicht weiter, da die den aktuellen Stand von Divi 5 nicht kennen.
Ich fand dann jedoch ein Beispiel, wie man Divi 4 und Divi 5 Module gleichermaßen erzeugen kann: https://github.com/elegantthemes/d5-tutorial-module-conversion – das habe ich daher direkt mal getestet. Und ja, ich konnte mir die in dem Package enthaltenen Module für Divi 4 und 5 erzeugen. Also habe ich versucht das zu adaptieren. Ich entschied mich schnell dafür sogenannte „dynamische Module“ zu verwenden, da ich für das Plugin die Ausgabe der Stellenangaben serverseitig erzeuge. Ein Modul besteht dabei aus:
- React-Komponenten für den Editor.
- Verschiedenen PHP-Dateien, die der Einbindung im Editor sowie der Generierung im Frontend dienen.
Was bei Divi 4 noch drei Dateien für die Editor-Komponenten waren, sind bei Divi 5 nun dreizehn. Siehe: https://github.com/elegantthemes/d5-tutorial-module-conversion/tree/master/divi-5/visual-builder/src/modules/dynamic-module
Meine nächsten Schritte waren daher:
- Das Modul in meinem eigenen Plugin erstmal 1:1 hinterlegen und erzeugen lassen. Klappte auch.
- Dann schauen, was von den React-Dateien für meine Anwendungsfälle tatsächlich benötigt wird. Ich entschied mich dafür dem Aufruf der Objekte folgend zu schauen was wo geladen wird um es inhaltlich zu differenzieren. Auf dem Weg habe ich die Anzahl der Dateien für mein Plugin auf „überschaubare“ 9 Dateien pro Modul zusammenstauchen können.
- Die PHP-Dateien bin ich auf gleiche Weise durchgegangen und konnte hier aus 8 Dateien lediglich 2 Dateien erstellen, die ledglich die Funktionen für ein Modul bereitstellen, die es tatsächlich benötigt.
Ich kann verstehen, wenn Entwickler ihre Tasks auf einzelne Dateien aufteilen. Das ist übersichtlicher und auch performant. Mache ich auch gerne so. Allerdings kenne ich keinen anderen PageBuilder, der dermaßen viele Dateien benötigt nur um ein simples Modul im Editor bereitzustellen. Divi 5 schlägt hier alle Rekorde und macht es für Entwickler extrem aufwendig.
Immerhin hatte ich so aber ein Ziel vor Augen und habe insgesamt 19 dieser Module für mein Plugin erstellen können. Dachte ich zu dem Zeitpunkt zumindest. Denn ich stieß auf die nächste Hürde. Damit der Anwender die Module auch konfigurieren kann, sollte man Felder und Buttons im Editor anbieten können. Ich habe insgesamt 4 volle Tage damit verbracht zu schauen, wie das in Divi 5 möglich ist, ohne auch nur einen winzigen Erfolg. Ja, ich kann sehr ausdauernd sein :) Ich kenne React und nutze es auch jederzeit aktiv. Aber bei Divi 5 schaue ich nicht durch, vor allem wegen der fehlenden Anleitung.
Während dieser mehrtägigen Recherche, habe ich mir auch das Theme selbst genauer angeschaut. Anders als der o.g. Slogan verlauten lässt, ist es keinesfalls eine komplette Neueinrichtung des Themes. Vermutlich aus Rücksicht auf die Migration sind scheinbar alle Komponenten von Divi 4 weiterhin in Divi 5 enthalten. An den meisten Dateien wurde natürlich auch etwas geändert. Aber ich fand auch einzelne Dateien, die exakt gleich in Divi 4 enthalten sind.
Viele der im Divi 5 Theme enthaltenen PHP-Dateien, sind nicht mit den WordPress Coding Standards kompatibel. Auch PHPStan meckert so einiges an, wenn man es mal drüber laufen lässt. Ja, es gibt Menschen die meinen, solche Standards müssen ja nicht erfüllt werden – die Codes können auch so sicher sein. Sind sie es, wenn man offenbar keine Prüfungen dazu durchlaufen lässt?
Beispiel:
<!-- Shortcodes used: <?php echo implode( ', ', $et_shortcode_framework_shortcodes_used ); ?> -->Hier fehlt für die Ausgabe jegliche Maskierung. $et_shortcode_framework_shortcodes_used ist eine globale Variable in der sprichwörtlich alles stehen könnte. Das bedeutet eine potentielle Gefahr für Besucher der Website. Und ja, ein potentielles Problem hierbei ist auch, dass Divi ein kommerzielles Theme ist, was keiner externen Kontrolle unterliegt (außer dem Cyber Ressiliance Act, der ab Mitte des Jahres in Europa gilt). Aber d.h. nicht gleichzeitig, dass man unsauberen Code liefen kann.
Ich hatte enorm viele Fragezeichen. Da ich eine gültige Lizenz hatte, wollte ich den Elegant Themes Support dazu ansprechen. Allerdings scheiterte ich hier gleich an mehreren Hürden:
- Entwicklerfragen zu Divi 5 soll man offenbar nicht an den normalen Support stellen.
- Es gibt von Divi-Enthusiasten einen Discord Server. Das ist kein offizieller Support, aber man bekommt den Tipp sich zu genau diesen Fragen beim offiziellen Divi Slack anzumelden. Ein Anmelde-Formular dafür wurde verlinkt.
- Ich habe inzwischen 4 Mal das Anmelde-Formular für den empfohlenen Divi Slack abgeschickt und nicht eine Antwort erhalten. Ich habe nirgendwo anders irgendeinen Hinweis auf diesen Slack-Server gefunden.
Somit stehe ich als Entwickler derzeit in Bezug auf Divi 5 blank da. Ich habe keine Möglichkeit anhand einer Anleitung oder in Rücksprache mit einem Divi Entwickler-Support meine 19 individuellen Module für Divi 5 zu vervollständigen. So etwas habe ich bisher bei keiner Software erlebt.
Fazit
Für von mir erstellte Projekte kommt Divi 5 definitiv nicht in Frage. Ich werde Anwendern, die meine Plugins nutzen, damit natürlich unterstützen. Ich kann verstehen, wenn Anwender die Oberfläche toll finden – ja, sie ist modern und bietet ein enormes Potential. Aber es krankt eben an dem Hintergrund des Ganzen. Ich bin insgesamt durchaus enttäuscht, wie man an dem Beitrag hier sicherlich erkennen kann.