So beheben Sie defektes CSS im WordPress Admin-Dashboard

Defektes CSS im WordPress-Admin-Dashboard sieht auf den ersten Blick beängstigend aus. Aber wir haben gelernt, dass es sich normalerweise um eine einfache Kettenreaktion handelt, die durch ein Plugin oder eine Cache-Regel verursacht wird, und wir können sie schnell aufspüren.

Nach der Unterstützung Tausender Leser und Kunden haben wir eine Checkliste verfeinert, die den Schuldigen aufspürt, ohne Ihre Inhalte zu berühren oder Ausfallzeiten zu riskieren.

Bleiben Sie bei uns und wir führen Sie durch jeden Schritt, damit Ihr Admin-Bereich wieder in Form kommt und Sie mit Zuversicht weiter aufbauen können.

Behebung von defektem CSS im WordPress-Admin-Dashboard

Hier ist ein kurzer Überblick über die Themen und Fehlerbehebungsschritte, die wir in diesem Artikel behandeln werden:

Was verursacht defektes CSS im WordPress-Adminbereich?

Es gibt mehrere Gründe, warum CSS im WordPress-Admin-Bereich fehlerhaft sein könnte. Wie bei vielen häufigen WordPress-Fehlern kann es für Anfänger frustrierend sein herauszufinden, was sie beheben müssen.

Nach unserer Erfahrung sind die folgenden die Hauptursachen für defektes CSS im WordPress-Admin-Bereich:

Plugin-Konflikte: Schlecht programmierte Plugins mit eigenem CSS können mit den Standard-WordPress-Stilen in Konflikt geraten, indem sie die Stile des Admin-Bereichs überschreiben oder stören.
HTTP/HTTPS-Fehler: Probleme mit gemischten Inhalten, bei denen einige Dateien über HTTP anstelle von HTTPS geladen werden, können dazu führen, dass Browser CSS-Dateien blockieren.
Theme-Konflikte: Einige Themes laden CSS im Admin-Bereich, was zu Konflikten führen kann. Wenn Sie ein benutzerdefiniertes Admin-Theme verwenden, kann dies ebenfalls zu Styling-Problemen führen.
Cache-Probleme: Der Browser-Cache kann veraltete Versionen von CSS-Dateien enthalten. Caching-Plugins können alte CSS-Dateien ausliefern, was zu Styling-Problemen führt.
CDN-Probleme: Falsch konfigurierte Content Delivery Networks (CDNs) können veraltete Versionen von CSS-Dateien ausliefern, was zu fehlenden oder fehlerhaften Stilen führt.
Falsche Dateiberechtigungen: CSS-Dateien mit falschen Berechtigungen sind möglicherweise nicht vom Server lesbar.
Beschädigte Dateien: CSS-Dateien können während Updates oder Uploads beschädigt werden oder fehlen.
Browser-Erweiterungen: Erweiterungen, insbesondere Inhaltsblocker, können die Anzeige von CSS beeinträchtigen.

Das Verständnis dieser Ursachen hilft Ihnen zu identifizieren, warum Ihr WordPress-Adminbereich defektes CSS aufweist, damit Sie es tatsächlich beheben können.

Schritt 1: Auf Plugin-Konflikte prüfen

Nach unserer Erfahrung sind schlecht programmierte WordPress-Plugins oft die Ursache für defektes CSS im Admin-Bereich. Manchmal können jedoch auch gut programmierte Plugins Probleme mit der Einrichtung Ihrer WordPress-Site oder Ihres Servers haben.

Hier erfahren Sie, wie Sie Plugin-Konflikte identifizieren und beheben können.

Alle Plugins deaktivieren

Zuerst müssen Sie zu Ihrem WordPress-Admin-Dashboard gehen und zur Seite Plugins » Installierte Plugins navigieren.

Wählen Sie nun alle Plugins aus und wählen Sie im Dropdown-Menü „Massenaktionen“ die Option „Deaktivieren“ und klicken Sie dann auf „Anwenden“.

Danach aktualisieren Sie einfach Ihren Adminbereich oder laden Sie die Seite neu, um zu sehen, ob das CSS-Problem behoben ist. Wenn das CSS behoben ist, liegt das Problem bei einem der Plugins.

Plugins nacheinander reaktivieren

Um festzustellen, welches Plugin das Problem verursacht, müssen Sie jedes einzeln reaktivieren. Sie können dies tun, indem Sie einfach auf den Link 'Aktivieren' unter dem Plugin klicken.

Nach der Aktivierung jedes Plugins müssen Sie den Admin-Bereich aktualisieren, um zu prüfen, ob das CSS erneut fehlerhaft ist.

Dies hilft Ihnen, das spezifische Plugin zu identifizieren, das das Problem verursacht.

Alternative finden oder Plugin aktualisieren

Sobald Sie das widersprüchliche Plugin identifiziert haben, können Sie prüfen, ob ein Update verfügbar ist. Wenn ein Update das Problem nicht behebt, sollten Sie ein alternatives Plugin suchen oder den Plugin-Entwickler um Unterstützung bitten.

Detaillierte Anweisungen finden Sie in unserem Tutorial zum Deaktivieren von Plugins. Dieses Tutorial zeigt auch, wie Sie Plugins über FTP deaktivieren, falls Ihr WordPress-Adminbereich nicht zugänglich ist.

Schritt 2: Laden unsicherer Dateien über HTTPS

Eine weitere häufige Ursache für defektes CSS, auf die unsere Benutzer gestoßen sind, ist, dass sie sichere URLs falsch konfiguriert haben, was zu Problemen mit gemischten Inhalten führt.

Dies geschieht, wenn Ihre Website so eingestellt ist, dass sie das sichere HTTPS-Protokoll verwendet, aber CSS über HTTP oder das unsichere Protokoll geliefert wird.

Wenn dies geschieht, blockieren gängige Browser wie Google Chrome automatisch unsichere Ressourcen, was zu defektem CSS in Ihrem WordPress-Adminbereich führt.

Dieses Problem kann mit dem Inspektionstool Ihres Browsers bestätigt werden. Wechseln Sie einfach zur Registerkarte "Konsole", und Sie sehen den Fehler "Mixed Content".

Um dieses Problem zu beheben, müssen Sie zunächst sicherstellen, dass Ihre WordPress-Einstellungen die richtigen URLs haben.

Gehen Sie zur Seite Einstellungen » Allgemein und stellen Sie sicher, dass sowohl die WordPress-Adresse als auch die Website-Adresse HTTPS in den URLs haben.

Wenn Sie bereits HTTPS in beiden URLs haben, können Sie WordPress manuell zwingen, das HTTPS-Protokoll zu verwenden.

Bearbeiten Sie einfach Ihre wp-config.php-Datei und fügen Sie den folgenden Code hinzu:

define('FORCE_SSL_ADMIN', true); if (strpos($_SERVER['HTTP_X_FORWARDED_PROTO'], 'https') !== false) { $_SERVER['HTTPS'] = 'on'; }

Alternativ können Sie Plugins wie Really Simple SSL verwenden, um HTTPS für alle URLs zu erzwingen.

Weitere Details finden Sie in unserem Tutorial unter So beheben Sie den Mixed-Content-Fehler in WordPress.

Schritt 3: Auf Theme-Konflikte prüfen

Wir haben festgestellt, dass unnötige Theme-Interferenzen ebenfalls eine häufige Ursache für defektes CSS im WordPress-Adminbereich sind.

Hier erfahren Sie, wie Sie Theme-bezogene Probleme identifizieren und beheben können.

Zu einem Standard-Theme wechseln

Um zu sehen, ob Ihr WordPress-Theme die Ursache für das defekte CSS ist, müssen Sie zuerst zu einem Standard-WordPress-Theme wechseln.

Gehen Sie zu Ihrem WordPress-Dashboard und navigieren Sie zur Seite Design » Themes.

Hier müssen Sie ein Standard-WordPress-Theme wie Twenty Twenty-Four aktivieren.

Hinweis: Wenn Sie keine Standard-Themes installiert haben, können Sie eines installieren, indem Sie oben auf die Schaltfläche „Neues Theme hinzufügen“ klicken. Standard-WordPress-Themes sind nach Jahren benannt.

Aktualisieren Sie Ihren Admin-Bereich, nachdem Sie zu einem Standard-Theme gewechselt haben, um zu sehen, ob das CSS-Problem behoben wurde.

Wenn das CSS jetzt korrekt geladen wird, liegt das Problem bei Ihrem vorherigen Theme.

Behebung von Theme-Konflikten

Um dies zu beheben, müssen Sie zunächst prüfen, ob ein Update für Ihr Theme verfügbar ist.

Gehen Sie zu Darstellung » Themes, wählen Sie Ihr Theme aus und klicken Sie auf „Jetzt aktualisieren“.

Wenn das Problem dadurch nicht behoben wird, müssen Sie alle Änderungen überprüfen, die Sie an Ihrem Theme vorgenommen haben. Überprüfen Sie alle Theme-Anpassungen, die das Problem mit defektem CSS verursachen könnten.

Insbesondere sollten Sie zusätzliches CSS oder benutzerdefinierten Code in der Datei functions.php auf Fehler überprüfen.

Wenden Sie sich als letzte Möglichkeit an den Theme-Entwickler, um Unterstützung zu erhalten, oder erwägen Sie den Wechsel zu einem anderen Theme.

Wir empfehlen die Verwendung von WPCode, um solche Fehler in Zukunft zu vermeiden. Es ist das beste WordPress-Plugin für Code-Snippets, mit dem Sie Ihr gesamtes benutzerdefiniertes CSS an einem Ort verwalten können und das keine Bearbeitung der functions.php -Datei erfordert.

Erstellen eines CSS-Codes zur Anpassung des Labels für neue Beiträge in WPCode

Hier sind einige der Vorteile von WPCode:

Sie können Ihren benutzerdefinierten CSS-Code einfacher speichern und verwalten.
WPCode enthält integrierte Prüfungen auf Fehler.
Sie verlieren Ihr benutzerdefiniertes CSS nicht, wenn Sie das Theme wechseln.

Eine kostenlose Version von WPCode ist ebenfalls mit eingeschränkten Funktionen erhältlich.

Wir verwenden WPCode auf unseren Websites, um benutzerdefinierte Code-Snippets, einschließlich benutzerdefiniertem CSS, zu verwalten. Weitere Details finden Sie in unserem WPCode-Testbericht.

Schritt 4: Cache-Probleme beheben

Normalerweise cachen WordPress-Caching-Plugins den WordPress-Adminbereich nicht.

Wir haben jedoch festgestellt, dass falsche Caching-Einstellungen zu Konflikten mit dem Browser-Cache führen können, was zu Problemen mit defektem CSS führen kann.

Um dies zu beheben, müssen Sie zuerst Ihren Browser-Cache leeren.

Zwischengespeicherte Daten zum Löschen in Google Chrome auswählen

Danach können Sie den WordPress-Adminbereich neu laden, um zu sehen, ob das Problem behoben ist. Wenn nicht, müssen Sie den WordPress-Cache leeren.

Dies ist der Cache, der von Ihrem WordPress-Caching-Plugin generiert wurde. Wir haben ein detailliertes Tutorial dazu, wie Sie den Cache in verschiedenen WordPress-Caching-Plugins löschen.

Schritt 5: CDN-Probleme beheben

Wenn Sie einen Content Delivery Network (CDN)-Dienst verwenden, kann eine Fehlkonfiguration manchmal zu Problemen mit defektem CSS im WordPress-Adminbereich führen.

Hier erfahren Sie, wie Sie diese Probleme identifizieren und beheben.

Zuerst müssen Sie das Inspect-Tool in Ihrem Browser verwenden und zum Tab „Konsole“ wechseln. Hier sehen Sie Fehler, wenn Ihre CSS-Dateien blockiert werden oder nicht gefunden werden.

CDN-Fehler, die zu fehlerhaftem CSS führen

Als Nächstes müssen Sie zu Ihrer CDN-Dienst-Website wechseln und sich in Ihrem Kontodashboard anmelden.

Navigieren Sie von hier aus zum Abschnitt Caching » Konfiguration und klicken Sie unter der Option Cache leeren auf die Schaltfläche „Alles leeren“.

Hinweis: Wir zeigen Ihnen den Screenshot des Cloudflare CDN. Sie werden jedoch leicht die Option zum Leeren des Caches bei allen CDN-Anbietern finden.

Danach müssen Sie zu Ihrer Website zurückkehren und den Admin-Bereich neu laden, um zu sehen, ob das Problem jetzt behoben ist.

Wenn dies nicht behoben ist, fahren Sie mit dem nächsten Schritt fort.

Schritt 6: Falsche Dateiberechtigungen beheben

Wir haben auch falsche Dateiberechtigungen gefunden, die verhindern, dass der Server CSS-Dateien lesen kann, was zu fehlerhaftem CSS im WordPress-Adminbereich führt.

Hier erfahren Sie, wie Sie Dateiberechtigungen überprüfen und beheben.

Zuerst müssen Sie sich über FTP mit Ihrer WordPress-Website verbinden.

Sobald Sie verbunden sind, müssen Sie zu Ihrem WordPress-Stammverzeichnis navigieren. Dies ist das Verzeichnis, das die Ordner wp-admin, wp-includes und wp-content enthält.

Klicken Sie nun mit der rechten Maustaste auf den Ordner wp-admin und wählen Sie 'Dateiberechtigungen' oder 'Eigenschaften'.

Zuerst müssen Sie sicherstellen, dass alle Verzeichnisse auf 755 gesetzt sind.

Wenn dies nicht der Fall ist, ändern Sie die Berechtigungen und wenden Sie sie rekursiv auf alle Unterverzeichnisse an.

Sie können den Vorgang nun wiederholen, die Berechtigungen auf 644 setzen und sie rekursiv nur auf alle Dateien anwenden.

Weitere Details finden Sie in unserem Tutorial zur Einstellung von Dateiberechtigungen in WordPress.

Besuchen Sie danach den Admin-Bereich, um zu sehen, ob das Problem mit dem defekten CSS behoben wurde. Wenn es immer noch besteht, müssen Sie mit dem nächsten Schritt fortfahren.

Schritt 7: Beschädigte Dateien reparieren

Beschädigte Dateien können defektes CSS im WordPress-Adminbereich verursachen.

Ihre WordPress-Dateien können auch ohne Ihr Zutun beschädigt werden. Dies kann durch ein unvollständiges WordPress-Update, versehentliches Löschen von Dateien oder eine Fehlkonfiguration durch Ihren WordPress-Hosting-Anbieter geschehen.

Hier erfahren Sie, wie Sie beschädigte Dateien reparieren oder ersetzen.

Zuerst müssen Sie eine frische Kopie von WordPress von WordPress.org herunterladen.

Extrahieren Sie dann die heruntergeladene ZIP-Datei auf Ihren Computer.

Als Nächstes müssen Sie sich mit FTP mit Ihrem WordPress verbinden und die frischen WordPress-Dateien von Ihrem Computer hochladen.

Wählen Sie „Überschreiben“, wenn Sie dazu aufgefordert werden, um sicherzustellen, dass frische Dateien auf Ihre Website hochgeladen werden.

Wenn Sie fertig sind, können Sie Ihren WordPress-Adminbereich besuchen, um zu sehen, ob dies das Problem mit dem defekten CSS behoben hat.

Wenn dies das Problem nicht löst, ist es an der Zeit, mit dem nächsten Schritt fortzufahren.

Schritt 8: Browser-Erweiterungen überprüfen

Browser-Erweiterungen, insbesondere solche, die sich auf Inhalts- und Werbeblocker beziehen, können die Anzeige von CSS im WordPress-Adminbereich beeinträchtigen.

Hier erfahren Sie, wie Sie Probleme identifizieren und beheben, die durch Browser-Erweiterungen verursacht werden.

Zuerst müssen Sie Ihren Browser öffnen und zum Menü für Erweiterungen/Add-ons navigieren.

Deaktivieren Sie vorübergehend alle Erweiterungen, insbesondere Ad-Blocker und Sicherheits-Add-ons.

Sie können Erweiterungen einfach deaktivieren oder vollständig entfernen.

Sobald dies erledigt ist, können Sie zum WordPress-Adminbereich gehen, um zu sehen, ob das CSS-Problem behoben ist.

Wenn das Problem behoben ist, müssen Sie herausfinden, welche Erweiterung das Problem verursacht hat.

Reaktivieren Sie jede Erweiterung einzeln und aktualisieren Sie den Admin-Bereich nach der Aktivierung jeder Erweiterung, um diejenige zu identifizieren, die das Problem verursacht.

Sobald Sie die problematischen Erweiterungen identifiziert haben, können Sie die Erweiterungseinstellungen überprüfen, um zu vermeiden, dass das CSS des WordPress-Adminbereichs blockiert wird.

Wenn das nicht funktioniert, versuchen Sie, eine alternative Erweiterung zu finden.

Fehlerbehebungstipps

Hoffentlich lösen die obigen Schritte die CSS-Probleme im WordPress-Adminbereich. Wenn jedoch keiner der obigen Schritte funktioniert, können Sie diese zusätzlichen Tipps ausprobieren:

Permalinks aktualisieren:

Aktualisieren Sie Ihre WordPress-Permalinks, um die .htaccess-Datei zu aktualisieren, ohne Fehler zu riskieren. Gelegentlich können WordPress-Rewrite-Regeln verhindern, dass CSS-Dateien korrekt geladen werden. Diese Aktion hilft, die URL-Rewrite-Regeln zu löschen und zurückzusetzen.

Auf Malware scannen:

Manchmal kann auch ein Hacking-Versuch oder Malware dazu führen, dass Ihr Admin-Bereich fehlerhaft erscheint. Scannen Sie Ihre WordPress-Website auf potenzielle Malware und versuchen Sie, Ihre gehackte Website zu bereinigen.

Wir hoffen, dieser Artikel hat Ihnen geholfen, das Problem mit defektem CSS im WordPress-Adminbereich zu beheben. Möglicherweise möchten Sie auch unseren Leitfaden zur Fehlerbehebung bei WordPress für zusätzliche Möglichkeiten zur Behebung von WordPress-Problemen oder unseren Leitfaden, wie Sie richtig nach WordPress-Support fragt, lesen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.