Skip to content

Alles für WordPress, Webentwicklung — und mehr

⚡ So deaktivieren Sie dashicons.min.css und beschleunigen Ihre WordPress-Website

⚡ So deaktivieren Sie dashicons.min.css und beschleunigen Ihre WordPress-Website

Die Seite ist langsam, und PageSpeed Insights verweist stillschweigend auf dashicons.min.css, 30 KB an Icons, die in keinem sichtbaren Element gerendert werden. Sie haben diese Datei weder installiert noch in Ihrem Theme eingebunden, und doch wird sie brav für jeden Besucher geladen. Woher kommt sie, und wie werden Sie sie wieder los?

WordPress liefert Dashicons standardmäßig für einen einzigen, engen Zweck an das Frontend aus: die Admin-Leiste für eingeloggte Nutzer. Ein normaler Gast bekommt die Admin-Leiste nie zu Gesicht, aber der Browser lädt brav das CSS herunter, parst es, baut das CSSOM auf und stellt erst dann fest, dass keine einzige Klasse benötigt wurde. Bei einer langsamen mobilen Verbindung schlagen diese 30 KB mit zusätzlichen 300-400 ms renderblockierender Ladezeit zu Buche, genug, um Ihre Core Web Vitals zu belasten.

Nachfolgend drei Wege, um Dashicons zu deaktivieren: von einem manuellen Snippet bis zu einer einzelnen Checkbox in einem Optimierungs-Plugin. Alle Methoden sind sicher, reversibel und auf echten WordPress-Installationen getestet.

💡 Kurzüberblick:

  • Öffnen Sie die DevTools oder PageSpeed Insights und prüfen Sie, ob dashicons.min.css auf Ihrer Seite tatsächlich geladen wird
  • Wählen Sie den Ansatz, der zu Ihrem Workflow passt: Code in der functions.php oder ein fertiges Optimierungs-Plugin
  • Testen Sie die Performance erneut und verifizieren Sie, dass die Datei aus dem Bericht verschwunden ist
  • Stellen Sie sicher, dass die Admin-Leiste für Administratoren weiterhin fehlerfrei funktioniert

Was sind Dashicons und warum laden sie im Frontend

Dashicons sind WordPress' eingebaute Icon-Schriftart, eingeführt in Version 3.8. Im Admin-Bereich tauchen sie überall auf: Icons für Menübereiche, Beitragstypen, Schaltflächen in der Werkzeugleiste. Ohne Dashicons wird der Admin-Bereich zu reinem Text, und WordPress kann nicht auf sie verzichten.

Das Problem liegt im Registrierungsmechanismus. Der Kern registriert die dashicons-Styles global und reiht sie nicht nur für das Backend, sondern auch für das Frontend in die Warteschlange ein, und das alles für ein einziges Szenario: Ein eingeloggter Nutzer besucht die Seite und sieht den schwarzen Admin-Leisten-Streifen mit Icons. Gäste bekommen keine Admin-Leiste, wohl aber die CSS-Datei. Der Browser parst sie, stellt fest, dass kein Selektor gegriffen hat, und verwirft das Ergebnis, aber die Zeit ist bereits verstrichen.

PageSpeed Insights und GTmetrix markieren dashicons.min.css in der Empfehlung „Ungenutztes CSS entfernen" und ziehen Punkte ab. Eine solche Datei wirkt nebensächlich. Wenn sich jedoch die Emoji-Styles von WordPress, CSS ungenutzter Plugins und tote Theme-Blöcke obendrauf stapeln, erreichen die kombinierten Einsparungen 150-300 KB. Für die mobile Performance ist das relevant.

PageSpeed Insights-Bericht mit einer Warnung zu ungenutztem Dashicons-CSS

So prüfen Sie, ob Dashicons auf Ihrer Seite laden

Bevor Sie etwas deaktivieren, stellen Sie sicher, dass das Problem besteht. Drei Methoden, jede dauert unter einer Minute.

Chrome DevTools. Öffnen Sie die Seite im Inkognito-Modus (damit die Admin-Leiste den Test nicht beeinflusst), drücken Sie F12, wechseln Sie zum Tab „Netzwerk" und geben Sie dashicons in das Filterfeld ein. Wenn Sie eine Datei mit Status 200 und einer Größe von rund 30 KB sehen, lädt sie für jeden Besucher.

PageSpeed Insights. Fügen Sie die URL in pagespeed.web.dev ein und führen Sie den Test aus. Klappen Sie die Empfehlung „Ungenutztes CSS entfernen" auf; dashicons.min.css wird mit seiner Größe und den potenziellen Einsparungen in Kilobyte aufgelistet.

GTmetrix. Wechseln Sie zum Tab „Wasserfall" und filtern Sie nach dashicons. Selbst wenn die Datei in der Ladekette als „Niedrig" oder „Niedrigste" markiert ist, blockiert sie dennoch das Rendering und drückt Ihren Score.

Hat keine dieser Methoden die Datei angezeigt? Dann hat Ihr Theme oder ein Optimierungs-Plugin Dashicons bereits deaktiviert, und Sie können diesen Artikel schließen. Haben Sie sie gefunden? Dann lassen Sie uns fortfahren.

Methode 1: Deaktivierung per Code in der functions.php

Der leichteste und transparenteste Ansatz: ein einzelnes Snippet in der functions.php Ihres aktiven Themes. Der Code deregistriert dashicons für alle Besucher ohne Administratorrechte. Für diejenigen, die die Seite administrieren, belassen wir sie, und die Admin-Leiste im Dashboard bleibt intakt.

Fügen Sie diesen Code in die functions.php eines Child-Themes oder über das Plugin Code Snippets ein (sicherer, da es Theme-Wechsel übersteht):

1/**
2 * Disable dashicons.min.css on the frontend for everyone,
3 * except users with administrator rights.
4 */
5function sdstudio_disable_dashicons_frontend() {
6 if ( current_user_can( 'update_core' ) ) {
7 return;
8 }
9 wp_deregister_style( 'dashicons' );
10}
11add_action( 'wp_enqueue_scripts', 'sdstudio_disable_dashicons_frontend' );

Der Hook wp_enqueue_scripts feuert, wenn die Styles-Warteschlange im Frontend zusammengestellt wird. current_user_can('update_core') prüft die Berechtigung, den Kern zu aktualisieren, die standardmäßig nur Administratoren besitzen. Für normale Besucher schlägt die Prüfung fehl, und wp_deregister_style('dashicons') entfernt die Datei vollständig aus der Warteschlange.

Warum deregister statt dequeue? wp_dequeue_style entfernt den Style aus der Warteschlange, lässt ihn aber registriert; ein anderes Plugin könnte Dashicons wieder in die Ausgabe einfügen. wp_deregister_style entfernt die Registrierung vollständig, und die einzige Möglichkeit, die Datei zurückzuholen, ist ein expliziter wp_register_style-Aufruf. Für Dashicons ist das die richtige Wahl: Sie möchten nicht, dass ein Social-Sharing- oder Galerie-Plugin sie versehentlich im Frontend wiederherstellt.

Vorsichtsmaßnahmen. Ein Fehler in der functions.php kann die Seite mit einem White Screen lahmlegen. Kopieren Sie die Datei vor der Bearbeitung nach functions.php.bak für ein schnelles Rollback. Verwenden Sie ein Child-Theme oder Code Snippets. Prüfen Sie die Syntax doppelt: jede Klammer und jedes Semikolon am richtigen Platz.

Methode 2: Optimierungs-Plugins (eine Checkbox statt Code)

Wenn Sie PHP lieber nicht anfassen möchten, lösen Performance-Plugins dasselbe Problem.

Perfmatters. Unter Allgemein → Optionen finden Sie einen Schalter „Dashicons deaktivieren". Ein Klick, und die Datei verschwindet aus dem Frontend. Perfmatters schließt Dashicons zudem vom Used CSS aus, wenn „Ungenutztes CSS entfernen" aktiv ist, sodass das Problem doppelt abgedeckt ist. Das Plugin ist kostenpflichtig, adressiert aber dutzende weitere Performance-Engpässe, von der Deaktivierung von Emoji-Styles bis zur Steuerung der Heartbeat-API.

WP Rocket. Unter Dateioptimierung → Optimierung der CSS-Auslieferung aktivieren Sie „Ungenutztes CSS entfernen". WP Rocket analysiert Ihre Seiten und entfernt ungenutzte Styles, einschließlich dashicons.min.css. Das funktioniert automatisch auf der gesamten Website. Falls „Ungenutztes CSS entfernen" mit einer anderen Optimierung kollidiert, fügen Sie dashicons.min.css zur Ausschlussliste hinzu; WP Rocket wird das Laden dann verzögern, anstatt es vollständig zu entfernen.

Asset CleanUp (kostenlos). Das Asset CleanUp-Plugin erlaubt Ihnen, CSS und JS selektiv auf Ebene einzelner Seiten und Inhaltstypen zu deaktivieren. Gehen Sie zum CSS/JS-Manager, suchen Sie dashicons.min.css und entladen Sie es seitenweit. Die kostenlose Version bewältigt die grundlegende Bereinigung.

Welche Methode sollten Sie wählen? Wenn Sie bereits Perfmatters oder WP Rocket einsetzen, nutzen Sie die eingebaute Funktion; packen Sie keinen zusätzlichen Code in die functions.php. Wenn Ihre Seite mit einem minimalen Satz an Plugins läuft und Sie mit PHP vertraut sind, ist das Snippet aus Methode 1 leichter und bringt keine Abhängigkeiten mit.

Das Ergebnis überprüfen

Öffnen Sie die Seite nach der Deaktivierung der Dashicons im Inkognito-Modus und wiederholen Sie die Prüfung aus Abschnitt zwei. Die Datei dashicons.min.css sollte aus der Liste der geladenen Ressourcen in den DevTools verschwunden sein. Führen Sie einen neuen PageSpeed-Insights-Test durch; die Metrik „Ungenutztes CSS entfernen" wird sinken, und die potenzielle Traffic-Ersparnis steigt um diese 30 KB.

Der tatsächliche Punktegewinn hängt von Ihrem Stack ab. Auf schlanken Seiten mit nur ein oder zwei CSS-Problemen bringt die Deaktivierung der Dashicons 1-3 Punkte im mobilen PageSpeed-Score. Auf aufgeblähten Seiten mit dutzenden ungenutzter Styles ist es ein Tropfen auf den heißen Stein, aber ein richtiger Tropfen: Jedes Kilobyte zählt, und solche „Tropfen" summieren sich zu einem spürbaren Ergebnis.

Prüfen Sie unbedingt die Admin-Leiste: Melden Sie sich als Administrator an und vergewissern Sie sich, dass der schwarze Streifen oben normal angezeigt wird und seine Icons vorhanden sind. Der Code aus Methode 1 und der Schalter in Perfmatters lassen Dashicons für Administratoren unangetastet, sodass Sie keinen Unterschied bemerken werden.

⁉️🤔 Häufig gestellte Fragen

Beeinträchtigt die Deaktivierung der Dashicons das Erscheinungsbild der Seite?

Wenn Ihr Theme Dashicons für Frontend-Icons verwendet (Slider-Pfeile, Schließen-Buttons, Hamburger-Menü), werden diese Elemente durch die Deaktivierung beschädigt. Der Test ist einfach: Deaktivieren Sie die Datei und gehen Sie die Seiten durch. Verschwinden Icons, ist das Theme auf Dashicons angewiesen. Setzen Sie in diesem Fall auf aggressives Caching über Cloudflare oder ein Caching-Plugin: 30 KB, die aus dem Browser-Cache ausgeliefert werden, sind nicht kritisch.

Funktioniert diese Methode mit Block-Themes (FSE)?

In Block-Themes wie Twenty Twenty-Four, Ollie und ähnlichen laden Dashicons üblicherweise nicht im Frontend. Der Block-Editor verwendet seine eigenen SVG-Icons, und der Kern reiht die Icon-Schriftart für Besucher nicht ein. Prüfen Sie per DevTools: Wahrscheinlich ist die Datei gar nicht vorhanden. Falls Sie sie doch finden, funktioniert der Code aus Methode 1 für klassische und Block-Themes gleichermaßen.

Kann ich Dashicons nur für bestimmte Seiten deaktivieren?

Ja, mit den Conditional Tags von WordPress. Zum Beispiel, um Dashicons nur auf der Startseite zu behalten:

1function sdstudio_conditional_dashicons() {
2 if ( is_front_page() ) {
3 return;
4 }
5 if ( current_user_can( 'update_core' ) ) {
6 return;
7 }
8 wp_deregister_style( 'dashicons' );
9}
10add_action( 'wp_enqueue_scripts', 'sdstudio_conditional_dashicons' );

Alle verfügbaren Conditional Tags sind in der WordPress-Dokumentation beschrieben. Dazu gehören is_single für einzelne Beiträge, is_page für Seiten, is_archive für Archive und is_home für die Blog-Übersicht.

Ich habe bereits ein Caching-Plugin, das die Seite beschleunigt. Sollte ich Dashicons trotzdem deaktivieren?

Ein Caching-Plugin beschleunigt wiederholte Besuche, aber der erste, kalte Besuch zieht dennoch dashicons.min.css. PageSpeed Insights emuliert bei jedem Test einen leeren Cache, sodass die Datei unabhängig vom serverseitigen Caching im Bericht erscheint. Die Deaktivierung der Dashicons reduziert die übertragene Datenmenge auf Quell-Ebene; sowohl Metriken als auch echte Besucher bei ihrem ersten Besuch profitieren davon.

Reicht die Deaktivierung der Dashicons für einen guten PageSpeed-Score?

Nein, es ist nur ein Schritt unter dutzenden. Die größten Gewinne bringen üblicherweise Bildoptimierung (Kompression, moderne Formate, Lazy Loading), verzögertes Laden von JavaScript und serverseitiges Caching. Betrachten Sie die Deaktivierung der Dashicons als Basishygiene: schnell, sicher, mit messbarem Effekt. Es ist ein bequemer Ausgangspunkt für die Bereinigung des Frontends.

Welche Methode Sie für Ihre Situation wählen sollten

Eine kurze Zusammenfassung der drei Methoden und konkrete Szenarien.

Wenn Sie mit Code arbeiten und Ihre Seite auf einem schlanken Stack läuft, greifen Sie zum Snippet aus Methode 1. Zwei Minuten, um es in die functions.php oder Code Snippets einzufügen, und das Problem ist dauerhaft erledigt. Keine zusätzlichen Plugins, keine zusätzliche Last im Admin.

Wenn Sie bereits für Perfmatters oder WP Rocket bezahlen, aktivieren Sie die eingebaute Option und schaffen Sie keine zusätzlichen Entitäten. Diese Plugins lösen ein weiteres Dutzend Performance-Probleme auf einmal, und zusätzlicher Code im Theme verkompliziert nur die Wartung.

Wenn Sie ein kostenloses Werkzeug ohne PHP-Bearbeitung benötigen, erledigt Asset CleanUp die Aufgabe mit zwei Klicks. Es eignet sich für Einsteiger und diejenigen, die kein Risiko eingehen möchten, die functions.php zu beschädigen.

Das Grundprinzip: Dashicons machen eine Seite nicht von allein langsam. Aber sie sind Teil des Hintergrundrauschens, das zusammen mit ungenutzten Plugin-Styles, schweren Schriftarten und nicht optimierten Bildern den Kanal verstopft und das Rendering verlangsamt. Dashicons zu entfernen ist ein schneller Gewinn und ein bequemer Ausgangspunkt für die systematische Optimierung.

Haben Sie sie deaktiviert? Hinterlassen Sie einen Kommentar und teilen Sie mit, wie viele PageSpeed-Punkte Sie gewonnen haben. Wenn Sie eine andere Methode kennen, die in diesem Artikel nicht behandelt wurde, teilen Sie auch diese mit.