DIVI 5 ist ein kompletter Rewrite – und deine Custom-Module laufen erstmal nur im Kompatibilitätsmodus. Was das bedeutet und wie du richtig migrierst.
DIVI 5 ist nicht einfach ein Update – es ist eine komplette Neuentwicklung. Elegant Themes hat den Builder von Grund auf neu geschrieben. Das bringt massive Performance-Vorteile, bedeutet aber auch: Deine Custom-Module aus dem DIVI Module Builder müssen angepasst werden.
Das Problem: Kompatibilitätsmodus
Wenn du mit dem DIVI Module Builder oder eigenen Extensions Custom-Module gebaut hast, werden diese nach dem Update auf DIVI 5 nicht einfach verschwinden. Sie funktionieren weiterhin – aber im sogenannten Kompatibilitätsmodus.
Wenn eine Seite auch nur EIN Modul enthält, das nicht für DIVI 5 migriert wurde, wird für diese Seite das komplette DIVI 4 Framework geladen. Die Performance-Vorteile von DIVI 5 sind damit für diese Seite dahin.
Das bedeutet konkret: Du baust dir eine technische Schuld auf. Je länger du wartest, desto mehr Seiten nutzen den langsamen Kompatibilitätsmodus.
Was sich technisch ändert
DIVI 5 ist ein fundamentaler Architektur-Wechsel. Hier die wichtigsten Unterschiede:
| Aspekt | DIVI 4 | DIVI 5 |
|---|---|---|
| Datenspeicherung | Shortcodes | JSON/Block-Format |
| Visual Builder | JSX (React) | TypeScript/React |
| Settings-Definition | get_fields() in PHP | module.json + TypeScript |
| PHP-Struktur | Eine große Klasse | Modulare Traits |
| Styling | CSS + Inline-Styles | SCSS + CSS-in-JS |
Von Shortcodes zu Blocks
Der größte Unterschied: DIVI 4 speichert Module als WordPress-Shortcodes:
[et_pb_custom_module title="Hallo Welt" _builder_version="4.27.0"]
Hier steht der Inhalt...
[/et_pb_custom_module]DIVI 5 verwendet stattdessen ein JSON-basiertes Block-Format:
{
"id": "module-abc123",
"name": "d5/custom-module",
"attrs": {
"title": {
"desktop": { "value": "Hallo Welt" }
}
}
}Der DIVI 5 Migrator
Jetzt die gute Nachricht: Du musst nicht jede Seite manuell anfassen! DIVI 5 kommt mit einem eingebauten Migrator-System:
WordPress Admin → Divi → Divi 5 MigratorWas der Migrator macht
Compatibility Check
Scannt deine komplette Website und erstellt einen detaillierten Report: Welche Module sind kompatibel, welche nicht?
Automatische Konvertierung
Alle kompatiblen Module werden automatisch vom Shortcode-Format ins neue Block-Format konvertiert.
Legacy-Wrapping
Module ohne DIVI 5 Support werden in Shortcodes verpackt und laufen im Kompatibilitätsmodus weiter.
Damit der Migrator dein neues DIVI 5 Modul als Nachfolger des alten erkennt, muss der d4Name in der module.json exakt dem alten Slug entsprechen.
Der Migrations-Workflow
Inventar erstellen
Liste alle deine Custom-Module auf: Name, Typ, Anzahl der Settings.
Extension-Boilerplate klonen
Hole dir das offizielle Example-Repo von Elegant Themes.
Module einzeln migrieren
Beginne mit dem einfachsten Modul. Erstelle alle erforderlichen DIVI 5 Dateien.
Auf Staging testen
Aktiviere deine neue Extension auf einer Staging-Umgebung. Führe den Migrator aus.
Live schalten
Wenn alles funktioniert: Backup erstellen, Extension auf Live aktivieren.
Die neue Dateistruktur
Ein DIVI 5 Modul besteht aus deutlich mehr Dateien als in DIVI 4:
my-divi5-extension/ ├── modules/ │ └── MyModule/ │ ├── MyModuleTrait/ │ │ ├── CustomCssTrait.php │ │ ├── ModuleStylesTrait.php │ │ └── RenderCallbackTrait.php │ └── MyModule.php ├── src/ │ └── components/ │ └── my-module/ │ ├── module.json │ ├── edit.tsx │ ├── settings-content.tsx │ ├── settings-design.tsx │ └── styles.tsx ├── package.json └── webpack.config.js
Migrations-Checkliste
Für jedes Modul solltest du folgende Punkte abhaken:
Fazit und Empfehlung
DIVI 5 ist ein großer Schritt nach vorne – aber er erfordert Arbeit. Die gute Nachricht: Du musst nicht alles auf einmal migrieren.
Meine Empfehlung: Beginne jetzt mit der Migration deiner wichtigsten Module. Je länger du wartest, desto mehr technische Schulden häufst du an.
Michael Rademacher, realmaker
Ressourcen
Brauchst du Unterstützung bei der Migration?
Als Agentur mit über 23 Jahren WordPress-Erfahrung helfe ich dir, deine DIVI-Module zukunftssicher zu machen.
