Divi Theme Probleme lösen: Darstellung & Formatierung

Wir erhalten regelmäßig Anfragen von Lesern, die mit bei der Verwendung des Divi Themes mit erstaunlichen Darstellungsproblemen zu kämpfen haben:

Wenn ich im Divi Builder einen Text formatiert habe, dann ändert Divi die Formatierung immer wieder, sobald ich über "Seite bearbeiten" eine weitere mögliche Gestaltung nutze. Desgleichen, wenn ich vom Visuellen Editor auf den Divi Builder wechsle. Sofort wird die gesamte Textformatierung wieder auf linksbündig gestellt.

Oder:

Ich habe die gleichen Probleme. Beim Wechsel zwischen visuellen Builder und Divi Builder verschwinden immer mal wieder alle meine Formatierungen. Öffne ich den Divi Builder sind sie da, schließe ich ihn sind sie weg. Öffne ich ihn, sind sie wieder da usw. Bisher konnte ich die Formatierung wieder herstellen durch zurückspringen in den Revisionen.

Oder:

Wenn ich in WP eingeloggt bin und auf die Seite gehe, wird sie genau so dargestellt, wie sie soll. Aber als nicht eingeloggter Besucher (also auch für alle die auf meine Seite gehen), fehlt der Bildslider mit Textboxen und die Überschrift ist verschoben (siehe Bilder). Hat jemand eine Idee woran das liegen kann? URL: www.buteo-loek.de

Allen Problemen gemeinsam ist, dass eingestellte Formatierungen oder auch Hintergrundbilder nicht angezeigt werden oder plötzlich wieder anders angezeigt werden. Oft entstehen diese Probleme im Zusammenhang mit der Aktivierung des Visual Builders, des Backend Builders oder einfach durch das Bearbeiten der Seite.

Divi Builder Darstellungsprobleme lösen

Wir selbst sind bisher von diesen Problemen verschont geblieben und konnten diese auch nicht nachstellen. Aber mit der Zeit hat sich eine oft wirkungsvolle Problemlösung gezeigt.

Offenbar hängen diese Probleme meist mit den Minifizierungsoptionen in den Divi Theme Einstellungen zusammen. Wenn diese Optionen aktiv sind, werden sowohl CSS- als auch Javascript-Dateien möglichst stark verkleinert, indem alles Überflüssige wie Kommentare oder Zeilenumbrüche aus dem Code entfernt und ggf. mehrere Dateien miteinander kombiniert werden.

So werden die Dateien einerseits kleiner und andererseits müssen weniger viele Dateien geladen werden. Dies sorgt normalerweise für eine Geschwindigkeitsverbesserung bei den Ladezeiten und damit dem Seitenaufbau. Diese Optionen sind standardmäßig in Divi aktiviert!

Offenbar können diese Funktionen von Divi gelegentlich erstaunliche Probleme verursachen. Meist liegt dies wohl auch daran, dass die Betroffenen zusätzlich Caching Plugins verwenden, die ebenfalls versuchen auf ähnlichen Wegen CSS- und Javascriptdateien zu verschlanken.

Divi Minifizierungsfunktionen deaktivieren

Die genannten Funktionen sind an drei Stellen zu finden und dort zu deaktivieren:

Im Adminbereich unter "Divi" > "Theme-Optionen" im Reiter "Generell" finden sich die zwei Optionen:

• "Minify And Combine Javascript Files"
• "Minify And Combine CSS Files"

Im Reiter "Divi Builder" existiert noch eine Option

• "Erzeugung der statischen CSS-Datei"

... die ebenfalls deaktiviert werden sollte.

Wichtig: Caches löschen

Anschließend löschst Du sicherheitshalber alle vorhandenen Caches. Dazu gehören ...

Caching Plugins & Server Cache

Viele Anwender nutzen Caching Plugins, um bessere Ladezeiten für Ihre Website zu erreichen. Dazu gehören z.B. W3 Total Cache, WP Super Cache oder auch das von uns gern verwendete WP Rocket. Auch hier können noch alte Daten gespeichert sein, die insbesondere beim ausgeloggten Zugriff auf Deine Website ausgeliefert werden. Daher solltest Du auch hier alle Caches löschen.

Einige Serversetups oder Hostinganbieter stellen eigene Cachingfunktionen zur Verfügung. Auch hier gilt: unbedingt Caches löschen, um die Auslieferung alter Daten zu verhindern.

Dein Browser Cache

Als letztes solltest Du auch den Cache Deines Browsers löschen, denn auch dort können veraltete Daten zwischengespeichert sein, die Probleme verursachen. Das Löschen des Browser Caches ist übrigens stets eine der ersten Handlungen, die man bei den unterschiedlichsten Problematiken vornehmen sollte. Oft lösen sich dann viele Probleme im Handumdrehen.

Konflikte mit Caching- und verschiedenen Optimierungs-Plugins

Meist genügen diese Handlungen, aber gelegentlich gibt es auch generelle Probleme mit Caching- und Optimierungsplugins, die eigene Funktionen für die Optimierung von CSS- und Javascriptdateien besitzen. So bietet z.B. die Plugins Autoptimize, Fast Velocity Minify und Merge + Minify + Refresh kein Caching, aber stellen ebenfalls Optimierungsfunktionen für CSS und Javascript zur Verfügung.

Wenn also die bisherigen Schritte keine Lösung gebracht haben, solltest Du versuchen herauszufinden, ob eines dieser Plugins die Ursache ist. Dafür schaltest Du die Plugins kurzfristig aus, löscht wieder alle Caches und schaust, ob das Problem weiter besteht. Im Ernstfall schaltest Du einfach alle Plugins aus, löscht alle Caches und falls das Problem dann nicht auftaucht, schaltest Du ein Plugin nach dem anderen wieder ein, bis das Problem wieder auftritt.

Wenn du auf diesem Weg herausgefunden hast welches Plugin die Ursache ist, kannst Du dort in den Einstellungen nach entsprechenden Optionen für die Komprimierung und Zusammenfassung von CSS- und Javascriptdatein schauen und dann prüfen, ob es genügt nur diese auszuschalten.

In einigen seltenen Fällen hat es übrigens schon genügt, die Plugins einmal aus- und wieder einzuschalten.

Problem gelöst?

In den meisten Fällen war damit das Problem gelöst.

Falls nicht, solltest Du Dich direkt an den Elegant Themes Support wenden. Diesen findest Du nach dem Login in den Mitgliedsbereich unter in der linken Sidebar unter "Help". Dort kannst Du Dich direkt an einen Mitarbeiter wenden oder im Community Forum nach Lösungen suchen.