Siden er treg, og PageSpeed Insights peker stille på dashicons.min.css, 30 KB med ikoner som ikke rendres i noe synlig element. Du installerte ikke denne filen eller la den i kø i temaet ditt, likevel lastes den trofast ned for hver besøkende. Hvor kommer den fra, og hvordan blir du kvitt den?

WordPress sender dashicons til frontend som standard for ett enkelt, smalt formål: adminlinjen for innloggede brukere. En vanlig gjest ser aldri adminlinjen, men nettleseren laster pliktoppfyllende ned CSS-en, analyserer den, bygger CSSOM-en, og innser først da at ikke en eneste klasse var nødvendig. På en treg mobiltilkobling betyr disse 30 KB en ekstra 300-400 ms render-blokkerende lastetid, nok til å skade Core Web Vitals.

Nedenfor finner du tre måter å deaktivere dashicons på: fra en manuell kodesnutt til en enkelt avkrysningsboks i en optimaliseringsplugin. Alle metodene er trygge, reversible og testet på ekte WordPress-installasjoner.

💡 Rask oversikt:

• Åpne DevTools eller PageSpeed Insights og bekreft at dashicons.min.css faktisk lastes på nettstedet ditt
• Velg tilnærmingen som passer arbeidsflyten din: kode i functions.php eller en ferdig optimaliseringsplugin
• Test ytelsen på nytt og bekreft at filen er borte fra rapporten
• Sørg for at adminlinjen fortsatt fungerer uten feil for administratorer

Hva er dashicons og hvorfor lastes de på frontend

Dashicons er WordPress sin innebygde ikonfont, introdusert i versjon 3.8. Inne i adminpanelet dukker de opp overalt: ikoner for menydeler, innholdstypeikoner, verktøylinjeknapper. Uten dashicons blir adminområdet til ren tekst, og WordPress kan ikke droppe dem.

Problemet ligger i registreringsmekanismen. Kjernen registrerer dashicons-stilene globalt og legger dem i køen ikke bare for admin, men også for frontend, alt for ett enkelt scenario: en innlogget bruker besøker nettstedet og ser den svarte adminlinjen med ikoner. Gjester får ikke adminlinjen, men de får likevel CSS-filen. Nettleseren analyserer den, oppdager at ingen selektor traff, og kaster resultatet, men tiden er allerede brukt.

PageSpeed Insights og GTmetrix flagger dashicons.min.css i anbefalingen «Fjern ubrukt CSS» og trekker poeng. Én slik fil virker ubetydelig. Men når emoji-stiler fra WordPress, CSS fra ubrukte plugin-er og døde temablokker hoper seg oppå den, når de samlede besparelsene 150-300 KB. For mobil ytelse har det betydning.

Hvordan sjekke om dashicons lastes på nettstedet ditt

Før du deaktiverer noe, bekreft at problemet finnes. Tre metoder, hver under ett minutt.

Chrome DevTools. Åpne nettstedet i inkognitomodus (slik at adminlinjen ikke påvirker testen), trykk F12, gå til Nettverk-fanen og skriv dashicons i filterfeltet. Hvis du ser en fil med status 200 og en størrelse på rundt 30 KB, lastes den for hver besøkende.

PageSpeed Insights. Lim inn URL-en i pagespeed.web.dev og kjør testen. Utvid anbefalingen «Fjern ubrukt CSS»; dashicons.min.css vil være oppført med størrelsen og potensielle besparelser i kilobyte.

GTmetrix. Gå til Waterfall-fanen og filtrer på dashicons. Selv om filen i lastekjeden er merket «Low» eller «Lowest», blokkerer den fortsatt rendring og trekker ned poengsummen din.

Ingen av disse metodene viste filen? Da har temaet ditt eller en optimaliseringsplugin allerede deaktivert dashicons, og du kan lukke denne artikkelen. Fant du den? La oss gå videre.

Metode 1: deaktiver via kode i functions.php

Den letteste og mest transparente tilnærmingen: en enkelt kodesnutt i functions.php til det aktive temaet ditt. Koden avregistrerer dashicons for alle besøkende uten administratorrettigheter. For de som administrerer nettstedet lar vi dem være i fred, og adminlinjen inne i dashbordet forblir intakt.

Legg til denne koden i functions.php i et child theme eller via Code Snippets-pluginen (tryggere fordi den overlever temabytter):

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

Hooken wp_enqueue_scripts fyres når stil-køen settes sammen på frontend. current_user_can('update_core') sjekker om brukeren har rettighet til å oppdatere kjernen, noe som standard kun tilhører administratorer. For vanlige besøkende slår sjekken feil, og wp_deregister_style('dashicons') fjerner filen fullstendig fra køen.

Hvorfor deregister i stedet for dequeue? wp_dequeue_style fjerner stilen fra køen, men lar den være registrert; en annen plugin kan legge dashicons tilbake i utdataene. wp_deregister_style fjerner registreringen fullstendig, og den eneste måten å få filen tilbake på er et eksplisitt wp_register_style-kall. For dashicons er dette det riktige valget: du vil ikke at en plugin for sosial deling eller galleri ved et uhell skal gjenopprette dem på frontend.

Forholdsregler. En feil i functions.php kan gi hvit skjerm på nettstedet. Før du redigerer, kopier filen til functions.php.bak for en rask tilbakerulling. Bruk et child theme eller Code Snippets. Dobbeltsjekk syntaksen: hver parentes og hvert semikolon på plass.

Metode 2: optimaliseringsplugins (én avkrysningsboks i stedet for kode)

Hvis du foretrekker å ikke røre PHP, løser ytelsesplugins det samme problemet.

Perfmatters. Under General → Options finner du en bryter for «Disable Dashicons». Ett klikk og filen forsvinner fra frontend. Perfmatters ekskluderer også dashicons fra Used CSS når Remove Unused CSS er aktivt, så problemet dekkes to ganger. Pluginen er betalt, men den håndterer dusinvis av andre ytelsesflaskehalser, fra å deaktivere emoji-stiler til å kontrollere heartbeat API-et.

WP Rocket. Under File Optimization → Optimize CSS Delivery, aktiver «Remove Unused CSS». WP Rocket vil analysere sidene dine og fjerne ubrukte stiler, inkludert dashicons.min.css. Det fungerer automatisk over hele nettstedet. Hvis Remove Unused CSS kommer i konflikt med en annen optimalisering, legg til dashicons.min.css i ekskluderingslisten; WP Rocket vil da utsette lastingen i stedet for å fjerne den helt.

Asset CleanUp (gratis). Asset CleanUp-pluginen lar deg selektivt deaktivere CSS og JS på nivå med enkeltsider og innholdstyper. Gå til CSS/JS Manager, finn dashicons.min.css og avlast den for hele nettstedet. Gratisversjonen håndterer grunnleggende opprydding.

Hvilken metode bør du velge? Hvis du allerede bruker Perfmatters eller WP Rocket, bruk den innebygde funksjonen; ikke legg til ekstra kode i functions.php. Hvis nettstedet ditt kjører på et minimalt sett med plugins og du er komfortabel med PHP, er kodesnutten fra metode 1 lettere og legger ikke til avhengigheter.

Bekreft resultatet

Etter å ha deaktivert dashicons, åpne nettstedet i inkognitomodus og gjenta sjekken fra del to. Filen dashicons.min.css skal være borte fra listen over lastede ressurser i DevTools. Kjør en ny PageSpeed Insights-test; målingen «Fjern ubrukt CSS» vil falle, og de potensielle trafikkbesparelsene vil øke med de 30 KB.

Den reelle gevinsten i poeng avhenger av stakken din. På lette nettsteder med bare ett eller to CSS-problemer gir deaktivering av dashicons 1-3 poeng på den mobile PageSpeed-poengsummen. På oppblåste nettsteder med dusinvis av ubrukte stiler er det en dråpe i havet, men en riktig dråpe: hver kilobyte teller, og slike «dråper» summeres til et merkbart resultat.

Sørg for å sjekke adminlinjen: logg inn som administrator og bekreft at den svarte stripen øverst vises normalt og at ikonene er på plass. Koden fra metode 1 og bryteren i Perfmatters lar dashicons være urørt for administratorer, så du vil ikke merke noen forskjell.

⁉️🤔 Ofte stilte spørsmål

Vil deaktivering av dashicons påvirke nettstedets utseende?

Hvis temaet ditt bruker dashicons til frontend-ikoner (slider-piler, lukkeknapper, hamburgermeny), vil deaktivering av dem ødelegge disse elementene. Testing er enkel: deaktiver filen og gå gjennom sidene. Hvis ikoner forsvinner, er temaet avhengig av dashicons. I så fall, bruk aggressiv caching gjennom Cloudflare eller en caching-plugin: 30 KB servert fra nettleserens cache er ikke kritisk.

Fungerer denne metoden med blokktemaer (FSE)?

I blokktemaer som Twenty Twenty-Four, Ollie og lignende, lastes dashicons vanligvis ikke på frontend. Blokkredigereren bruker sine egne SVG-ikoner, og kjernen legger ikke ikonfonten i kø for besøkende. Sjekk via DevTools: sjansen er stor for at filen ikke er der. Hvis du likevel finner den, fungerer koden fra metode 1 på samme måte for klassiske temaer og blokktemaer.

Kan jeg deaktivere dashicons bare for visse sider?

Ja, ved å bruke WordPress sine betingede tagger. For eksempel, for å beholde dashicons bare på forsiden:

1
function 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
}
10
add_action( 'wp_enqueue_scripts', 'sdstudio_conditional_dashicons' );

Alle tilgjengelige betingede tagger er beskrevet i WordPress-dokumentasjonen. De inkluderer is_single for enkeltinnlegg, is_page for sider, is_archive for arkiver og is_home for bloggindeksen.

Jeg har allerede en caching-plugin som gjør nettstedet raskere. Bør jeg fortsatt deaktivere dashicons?

En caching-plugin gjør gjentatte besøk raskere, men det første kalde besøket henter fortsatt dashicons.min.css. PageSpeed Insights emulerer en ren cache på hver test, så filen vil vises i rapporten uavhengig av caching på serversiden. Deaktivering av dashicons reduserer dataoverføringen ved kilden; både målinger og ekte besøkende på deres første besøk drar nytte av det.

Er deaktivering av dashicons nok for en god PageSpeed-poengsum?

Nei, det er bare ett steg blant dusinvis. De største gevinstene kommer vanligvis fra bildeoptimalisering (komprimering, moderne formater, lazy loading), utsatt JavaScript-lasting og caching på serversiden. Tenk på deaktivering av dashicons som grunnleggende hygiene: raskt, trygt, med en målbar effekt. Det er et praktisk utgangspunkt for å rydde opp i frontend.

Hvilken metode du bør velge for din situasjon

Et raskt sammendrag av de tre metodene og spesifikke scenarioer.

Hvis du jobber med kode og nettstedet ditt kjører på en slank stakk, ta kodesnutten fra metode 1. To minutter å lime den inn i functions.php eller Code Snippets, og problemet er lukket for godt. Ingen ekstra plugins, ingen ekstra belastning på admin.

Hvis du allerede betaler for Perfmatters eller WP Rocket, aktiver det innebygde alternativet og ikke opprett ekstra enheter. Disse pluginene løser et dusin andre ytelsesproblemer samtidig, og ekstra kode i temaet kompliserer bare vedlikeholdet.

Hvis du trenger et gratis verktøy uten å redigere PHP, håndterer Asset CleanUp oppgaven i to klikk. Det passer for nybegynnere og de som foretrekker å ikke risikere å ødelegge functions.php.

Det generelle prinsippet: dashicons gjør ikke et nettsted tregt i seg selv. Men de er en del av bakgrunnsstøyen som, kombinert med ubrukte plugin-stiler, tunge fonter og uoptimaliserte bilder, tetter kanalen og bremser rendring. Å fjerne dashicons er en rask gevinst og et praktisk utgangspunkt for systematisk optimalisering.

Deaktiverte du dem? Legg igjen en kommentar og del hvor mange PageSpeed-poeng du oppnådde. Hvis du kjenner en annen metode som ikke er dekket i denne artikkelen, del den også.