Meine Website hat keine Styles und sieht kaputt aus

Falls deine Website kaputt aussieht in dem Sinne, dass sie zwar lädt, aber keine Styles angewandt werden, wie in der Abbildung unten, kannst du einige wichtige Schritte zur Fehlersuche beitragen, die uns darin unterstützen, dir noch schneller mit einer Lösung weiterzuhelfen.

Seite ohne CSS-Stile

Finde den Fehler …

In unserem Beispiel verwenden wir Google Chrome als Browser, aber jeder moderne Browser hat ein ähnliche Werkzeuge.

  1. Rechtsklicke (ctrl+Klick) auf eine beliebige Stelle auf der kaputten Seite und  wähle „Prüfen“ aus dem Kontextmenü.
  2. Dies wird eine Leiste am unteren oder rechten Rand des Bildschirms zeigen. Klicken du auf die rote Benachrichtigung oben rechts auf diesem Panel.
  3. Du anschließend ein paar rote Fehlermeldungen sehen; mache davon bitte ein Bildschirmfoto und hänge es an deine Support-Anfrage an.

Häufige Fehler

Unsichere Inhalte vom CDN

Wenn du SSL auf deiner Website verwendest, so dass deine Seiten über HTTPS ausgeliefert werden, und du verwendest ein CDN, muss auch dein CDN alle Dateien über HTTPS ausliefern. Ist das nicht der Fall, werden die meisten Browser die CDN-Ressourcen als unsichere Inhalte blockieren, einschließlich Bilder, CSS-Dateien usw., und deine Website wird kaputt aussehen.

Wenn du auf die rote Fehlermeldung in Chrome klickst, wirst du in Etwa so etwas sehen (beachte die ERR_INSECURE_RESPONSE im unteren Bereich):

Fehlermeldungen in der Browser-Konsole

Lösung: Sprich mit deinem CDN-Provider und schau, ob sie HTTPS für deine CDN-Dateien aktivieren können. Wenn nicht, musst du in den CDN-Einstellungen von  WP Rocket die Option Deaktivieren CDN auf HTTPS-Seiten aktivieren.

Sicherheitsbedingte Restriktionen

Einige Security-Plugins platzieren eine eigene .htaccess-Datei in einigen der Ordner auf dem Server. Dies kann die korrekte Ausführung der Minifizierung verhindern und damit den Zugang zu einigen deiner Dateien blockieren.

Typischerweise zeigt sich diese Fehlerquelle als Fehler 403 (Forbidden), wie auf dieser Abbildung:

Fehler 403 (Forbidden) in der Browser-Konsole

Lösung: Wenn du ein Sicherheitsplugin verwendest, ändere dessen Einstellungen, bis der Fehler behoben wird. Du kannst auch manuell den /wp-content-Ordner auf zusätzliche .htaccess-Dateien überprüfen. Wenn du eine findest, benenne sie vorübergehend um und schau, ob das den Fehler behebt.

Fehler 404 bei minifizierten Dateien

Wenn deine Website kaputt aussieht und du einen Fehler 404 für minifizierte Dateien siehst, kann es schwierig werden, die Ursache festzustellen. Im Allgemeinen spielt das Verfallsdatum deines Cache eine Rolle. Meist werden aus irgendeinem Grund die minifizierten Dateien nicht gelöscht, wenn der Cache automatisch geleert wird, so dass der Cache auf alte Dateiversionen verweist, die nicht mehr verfügbar sind – daher der Fehler 404.

Fehler 404 bei minifizierten Dateien in der Browser-Konsole

Lösung: Setze in den Basis-Einstellungen von WP Rocket die Lebensdauer des Cache auf 0. (Dein Cache wird trotzdem noch problemlos auf dem neuesten Stand gehalten, wenn du neue Inhalte veröffentlichst).