WordPress-Layout kaputt — wenn die Seite plötzlich nackt aussieht.
Gestern sah die Website noch gut aus, heute ist sie ein Durcheinander aus unformatiertem Text, riesigen Bildern und Aufzählungspunkten. Das sieht dramatisch aus, ist aber meist harmlos: Die Inhalte sind alle da, nur die Gestaltungsdateien werden nicht geladen. Hier steht, warum und wie du es schnell behebst.
Ein zerschossenes Layout heißt fast immer: CSS-Dateien laden nicht oder sind veraltet. Häufigste Ursachen: Cache und Optimierungs-Plugins (zusammengefasste Dateien, die es nicht mehr gibt), Page-Builder-CSS, das neu erzeugt werden muss, falsche Adresse nach einem Umzug, Mixed Content (http-Dateien auf einer https-Seite) und CDN. Die Browser-Konsole zeigt die fehlenden Dateien rot an.
Diagnose in zwei Minuten.
- Anderer Browser oder privates Fenster: Sieht die Seite dort normal aus, liegt es am Browser-Cache. Hart neu laden mit Strg+Umschalt+R bzw. Cmd+Umschalt+R.
- Entwicklertools → Konsole: Rote Einträge wie „Failed to load resource: 404“ oder „Mixed Content“ zeigen, welche Dateien fehlen und warum.
- Entwicklertools → Netzwerk, Filter „CSS“: Welche Dateien laden mit Status 200, welche mit 404 oder 403? Wohin zeigen die Adressen — richtige Domain, https?
- Eingeloggt vs. ausgeloggt: Sehen nur Besucher die kaputte Seite, liegt es fast sicher am Seiten-Cache.
| Konsole zeigt | Ursache | Abschnitt |
|---|---|---|
| 404 auf Dateien in /cache/ oder mit langen Zufallsnamen | Optimierungs-Plugin verweist auf gelöschte Dateien | Cache und Optimierung |
| 404 auf /uploads/elementor/css/ | Builder-CSS fehlt | Elementor und andere Builder |
| Dateien von alter Domain oder Staging | Adresse nach Umzug nicht ersetzt | Nach Umzug |
| „Mixed Content … was loaded over HTTPS, but requested an insecure stylesheet“ | http-Verweise auf https-Seite | Mixed Content |
| 403 auf CSS-Dateien | Rechte, Hotlink-Schutz, Firewall | 403 Forbidden |
Cache und Optimierung.
Plugins wie Autoptimize, WP Rocket, LiteSpeed Cache oder W3 Total Cache fassen CSS-Dateien zusammen, verkleinern sie und legen sie unter neuen Namen ab. Die zwischengespeicherte HTML-Seite verweist auf diese Dateien. Wird der Optimierungs-Ordner geleert, der Seiten-Cache aber nicht, zeigt die Seite auf Dateien, die es nicht mehr gibt. Lösung: alle Caches leeren, in der richtigen Reihenfolge — Optimierung, Seiten-Cache, Server-Cache, CDN. Tritt das Problem danach wieder auf, die CSS-Optimierung testweise abschalten. Besonders „kritisches CSS“ und „ungenutztes CSS entfernen“ zerlegen gern Layouts. Mehr zu Caching mit Maß: WordPress langsam.
Elementor und andere Builder.
Elementor erzeugt für jede Seite eine eigene CSS-Datei unter wp-content/uploads/elementor/css/. Nach einem Umzug, einem Update oder wenn der Ordner nicht beschreibbar ist, fehlen diese Dateien oder sind veraltet. Lösung: Elementor → Werkzeuge → „Dateien und Daten neu generieren“ und danach alle Caches leeren. Hilft das nicht, die Rechte des Uploads-Ordners prüfen. Elementor bietet außerdem die Option, CSS direkt in die Seite zu schreiben statt als Datei — als Übergangslösung nützlich. Divi und andere Builder haben vergleichbare Funktionen zum Neuerzeugen. Weitere Elementor-Probleme: Elementor-Fehler beheben.
Nach Umzug oder Domainwechsel.
Zeigen die CSS-Adressen im Netzwerk-Reiter auf die alte Domain oder die Testumgebung, wurde die Adresse nicht vollständig ersetzt. WordPress speichert Adressen an vielen Stellen in der Datenbank, teilweise in serialisierten Daten, die ein einfaches Suchen-und-Ersetzen beschädigt. Die sichere Methode mit WP-CLI und Trockenlauf steht im Ratgeber WordPress-Umzug. Außerdem prüfen: Stimmen unter Einstellungen → Allgemein beide Adressen?
Mixed Content.
Läuft die Seite über https, lädt aber CSS-Dateien per http://, blockiert der Browser sie — das Layout bricht zusammen, und das Schloss in der Adresszeile verschwindet. Typisch nach der Umstellung auf SSL. Lösung: Adressen in der Datenbank von http auf https umstellen, im Theme fest eingetragene http-Verweise korrigieren, die Adressen unter Einstellungen → Allgemein prüfen. Ausführlich: „Nicht sicher“-Warnung beheben.
# Erst ansehen, was sich ändern würde
wp search-replace 'http://deine-domain.de' 'https://deine-domain.de' --all-tables --dry-run
# Dann wirklich ersetzen — vorher Backup!
wp search-replace 'http://deine-domain.de' 'https://deine-domain.de' --all-tablesWP-CLI behandelt serialisierte Daten korrekt. Danach Builder-CSS neu erzeugen und alle Caches leeren.
CDN und Server-Cache.
Ein CDN wie Cloudflare oder Bunny speichert CSS-Dateien weltweit zwischen. Wurde eine Datei geändert oder gelöscht, liefert das CDN eventuell noch die alte Version aus — oder die HTML-Seite verweist auf eine Datei, die im CDN fehlt. Im CDN-Dashboard den Cache vollständig leeren. Bei Hostern mit eigenem Server-Cache, etwa Varnish oder einem LiteSpeed-Server-Cache, gibt es im Kundenmenü meist einen Button dafür.
Nach einem Update.
Ist das Layout direkt nach einem Theme-, Builder- oder Plugin-Update kaputt und Cache leeren hilft nicht, hat das Update Klassen oder Strukturen geändert, auf die eigenes CSS aufbaut. Oder ein Child-Theme überschreibt eine Vorlage, die es so nicht mehr gibt. Erste Hilfe: Update auf einer Staging-Kopie nachstellen oder die vorherige Version wieder einspielen, dann das eigene CSS anpassen. Mehr dazu: Fehler nach Update.
Wenn du nicht weiterkommst.
Wenn Cache leeren nicht hilft und die Konsole keine eindeutige Spur zeigt, liegt es meist an einem Zusammenspiel aus Builder, Optimierung und Server. Ich finde die Ursache, behebe sie und erkläre dir, was passiert ist: WordPress-Hilfe, bei einem Totalausfall der Notfall-Support. Damit es gar nicht erst so weit kommt: WordPress-Wartung.
Wer hilft.
Ich bin Manuel Killert, WordPress-Entwickler aus Quakenbrück. Seit 2020 baue und betreue ich WordPress-Websites — für Handwerksbetriebe, Industrie, Gastronomie, Start-ups und Vereine —, entwickle eigene Plugins und unterrichte WordPress als Dozent an der KW Design Akademie. Das heißt: Ich kenne die typischen Fehler nicht nur aus Foren, sondern aus eigenen Projekten, und ich kann sie so erklären, dass du sie beim nächsten Mal selbst erkennst. Du erreichst mich direkt, ohne Ticketsystem.
Echte Projekte — live ansehen.
WordPress-Websites, die ich gebaut habe oder laufend betreue.
Markenfest
Stärkerer Online-Shop — Webdesign, Content und individuelle Shop-Funktionen.
Website ansehen ↗
KT Bodenteam
Professioneller Auftritt für einen Bodenleger — Vorher-Nachher-Slider und regionale SEO.
Website ansehen ↗
Potassco Solutions
Klare Website für ein KI-Unternehmen, die komplexe Technologie verständlich macht.
Website ansehen ↗FAQ — WordPress-Layout kaputt.
Warum sieht meine WordPress-Seite plötzlich kaputt aus?
Meist laden die CSS-Dateien nicht. Häufige Ursachen sind ein Cache, der auf gelöschte optimierte Dateien verweist, fehlendes Page-Builder-CSS, eine falsche Adresse nach einem Umzug, Mixed Content oder ein veralteter CDN-Cache.
Wie finde ich heraus, welche CSS-Datei fehlt?
In den Entwicklertools des Browsers unter Konsole und Netzwerk. Fehlende Dateien erscheinen rot mit Statuscode 404 oder 403, blockierte Dateien mit dem Hinweis Mixed Content.
Wie behebe ich fehlendes Elementor-CSS?
Unter Elementor, Werkzeuge die Funktion Dateien und Daten neu generieren ausführen und danach alle Caches leeren. Hilft das nicht, die Schreibrechte des Uploads-Ordners prüfen.
Warum ist das Layout nur für Besucher kaputt, nicht für mich?
Eingeloggte Nutzer bekommen meist keine Seiten aus dem Cache. Besucher sehen dagegen eine zwischengespeicherte Version, die auf nicht mehr vorhandene Dateien verweist. Alle Caches leeren behebt das.
Was ist Mixed Content?
Eine https-Seite lädt Dateien über unverschlüsseltes http. Der Browser blockiert diese Dateien, und das Layout bricht zusammen. Die Adressen müssen in Datenbank und Theme auf https umgestellt werden.
In welcher Reihenfolge leere ich die Caches?
Zuerst die CSS- und JavaScript-Optimierung, dann den Seiten-Cache im Plugin, dann den Server-Cache beim Hoster und zuletzt den Cache des CDN.
Das bin ich – rechts im BildErzähl mir, was nicht funktioniert.
Domain und eine kurze Beschreibung reichen — du bekommst eine ehrliche Einschätzung, was los ist und was die Behebung kostet.
Antwort meist innerhalb von 24 Stunden · hallo@manuelkillert.de