Divi ist ein WordPress-Theme mit integriertem visuellem Page-Builder des Unternehmens Elegant Themes, das zu den weltweit meistinstallierten kommerziellen WordPress-Produkten zählt.
Was bedeutet das?
Divi ist mehr als ein gewöhnliches WordPress-Theme. Es liefert ein vollständiges System aus Theme und Page-Builder in einem Paket. Der integrierte Divi Builder kann als visueller Frontend-Editor genutzt werden, der die Seite so anzeigt, wie sie später im Browser erscheint, oder als strukturierter Backend-Editor in wp-admin. Inhalte werden mit einem eigenen System aus Sektionen, Zeilen und Modulen aufgebaut. Sektionen bilden die größten Layoutbereiche, Zeilen definieren die Spaltenstruktur und Module sind die einzelnen Inhaltselemente: Textblock, Bild, Schaltfläche, Slider, Akkordeon, Preisliste, Kontaktformular und viele weitere.
Divi wird nicht über das offizielle WordPress-Theme-Verzeichnis vertrieben, sondern ausschließlich über Elegant Themes per Jahresabonnement. Das Abo berechtigt zur Nutzung auf unbegrenzt vielen eigenen Websites und schließt alle Elegant-Themes-Produkte ein, unter anderem den Divi Builder als eigenständiges Plugin, das unabhängig vom Divi Theme mit jedem anderen Theme kombiniert werden kann. Die große Nutzerbasis und eine aktive Community haben ein breites Ökosystem aus Erweiterungs-Plugins, fertigen Layout-Paketen und Child Themes entstehen lassen.
Divi speichert Seiteninhalte als eigenes Shortcode-Format in der WordPress-Datenbank. Das hat Konsequenzen bei einem Theme-Wechsel: Deaktiviert man Divi, erscheinen alle mit Divi erstellten Seiten als unlesbarer Shortcode-Text. Eine Migration weg von Divi erfordert daher in der Regel manuelle Neugestaltung oder den Einsatz spezialisierter Konvertierungswerkzeuge. Neuere Versionen von Divi unterstützen auch den Einsatz nativer WordPress-Blöcke innerhalb des Divi-Editors.
Beispiel aus der Praxis
Eine Agentur gestaltet eine Landingpage für ein neues Produkt. Im Divi Frontend-Builder öffnet sie die Seite, fügt eine dreispaltige Zeile ein und zieht per Drag & Drop ein Bild-Modul in die erste Spalte, einen Textblock in die zweite und ein Schaltflächen-Modul in die dritte. Farben, Abstände und Schriftgrößen werden direkt am Modul eingestellt. Die fertige Seite wird als Divi-Layout gespeichert und steht für künftige Projekte zur Wiederverwendung bereit. Ein Kollege ohne Programmierkenntnisse kann das Layout als Basis für eine neue Seite laden und anpassen.
Tipp aus der Praxis
Divi erzeugt vergleichsweise viel HTML-Ausgabe und lädt zahlreiche CSS- und JavaScript-Dateien. Das wirkt sich auf die Ladegeschwindigkeit aus. Aktivieren Sie in den Divi Theme Options die Option „Static CSS File Generation“: Sie fasst alle Divi-Styles zu einer einzigen komprimierten Datei zusammen, statt sie dynamisch aus vielen kleinen Quellen zusammenzubauen. Kombinieren Sie das mit einem Caching-Plugin und überprüfen Sie die Ladezeit regelmäßig mit einem Werkzeug wie PageSpeed Insights. Da Divi weit verbreitet ist, sollten Sie Updates stets zeitnah einspielen; gut gepflegte Installationen schließen bekannte Sicherheitslücken schnell.