Skip to content

Alt om WordPress, webutvikling — og mer til

🛠 Slik legger du til Expires-headere i .htaccess: trinn-for-trinn-guide

🛠 Slik legger du til Expires-headere i .htaccess: trinn-for-trinn-guide

Du kjørte en test i GTmetrix, og der står det i rødt: «Add Expires Headers». Et kjent syn. Nettstedet ligger på WordPress, hosting på Apache, og hastighetstesten krever at du konfigurerer nettleser-caching via en .htaccess.

Feilen er ikke kritisk, men den er irriterende. Uten Expires-headere laster nettleseren ned bilder, CSS og skript fra serveren ved hvert besøk. Gjentatte ganger. Selv om ingenting har endret seg. Hastigheten faller, brukerne venter, Google senker rangeringen.

Du kan fikse dette på fem minutter. To metoder: manuelt via kode i.htaccess eller med en plugin i to klikk. Nedenfor finner du begge, med ferdig kode og innstillinger.

💡 Rask oversikt:

  • Forstå hvordan Expires- og Cache-Control-headere styrer nettleserens cache
  • Legg til ferdig kode i.htaccess: kopier, lim inn, sjekk
  • Installer AEH Speed Optimization-pluginen på ett minutt hvis du ikke vil røre kode
  • Konfigurer optimale caching-perioder for bilder, CSS, JS og fonter

Slik fungerer Expires-headere

Når en besøkende kommer til et nettsted, laster nettleseren dusinvis av filer: HTML-siden, CSS-stiler, JavaScript, fonter, ikoner, bilder. Hver fil er en separat HTTP-forespørsel til serveren. Jo flere forespørsler, desto lengre lastetid.

Expires-headeren forteller nettleseren: «denne filen endres ikke, lagre den i cache og ikke spør igjen før en bestemt dato.» Ved gjentatte besøk henter nettleseren filer fra lokal cache i stedet for å hente dem fra serveren på nytt. Resultat: dusinvis færre forespørsler og rask lasting.

Den moderne ekvivalenten er Cache-Control-headeren med max-age-direktivet. Den angir cache-levetid i sekunder, ikke en spesifikk dato, og regnes nå som primær. Vi anbefaler å konfigurere begge headerne samtidig: Expires for gamle nettlesere og proxyer, Cache-Control for alt moderne. Begge skrives i samme.htaccess-blokk.

Add Expires Headers-feil i GTmetrix-rapport

Metode 1: kode i.htaccess

Den mest direkte veien er å legge til caching-regler direkte i Apaches konfigurasjonsfil. .htaccess-filen ligger i nettstedets rot (samme sted som wp-config.php). Hvis du ikke ser den, aktiver visning av skjulte filer i FTP-klienten din eller hostingens filbehandler.

Før du redigerer, last ned en kopi av filen til datamaskinen din. En syntaksfeil i.htaccess kan krasje nettstedet med en 500-feil, en sikkerhetskopi lar deg rulle tilbake på et sekund.

Åpne .htaccess i et redigeringsprogram og legg til følgende blokk før # BEGIN WordPress:

1 # Browser caching: Expires and Cache-Control headers
2<IfModule mod_expires.c>
3 ExpiresActive On
4
5 # Images
6 ExpiresByType image/jpg "access plus 1 year"
7 ExpiresByType image/jpeg "access plus 1 year"
8 ExpiresByType image/gif "access plus 1 year"
9 ExpiresByType image/png "access plus 1 year"
10 ExpiresByType image/webp "access plus 1 year"
11 ExpiresByType image/avif "access plus 1 year"
12 ExpiresByType image/svg+xml "access plus 1 year"
13 ExpiresByType image/x-icon "access plus 1 year"
14
15 # CSS and JavaScript
16 ExpiresByType text/css "access plus 1 month"
17 ExpiresByType application/javascript "access plus 1 month"
18
19 # Fonts
20 ExpiresByType font/woff2 "access plus 1 year"
21 ExpiresByType font/woff "access plus 1 year"
22
23 # PDF and other documents
24 ExpiresByType application/pdf "access plus 1 month"
25
26 # Default
27 ExpiresDefault "access plus 2 days"
28</IfModule>
29
30 # Cache-Control headers for modern browsers
31<IfModule mod_headers.c>
32 &lt;FilesMatch &quot;\.(jpg|jpeg|png|gif|webp|avif|svg|ico|woff2|woff)$&quot;&gt;
33 Header set Cache-Control "max-age=31536000, public"
34 </FilesMatch>
35 &lt;FilesMatch &quot;\.(css|js)$&quot;&gt;
36 Header set Cache-Control "max-age=2592000, public"
37 </FilesMatch>
38</IfModule>

Hva skjer her. Den første blokken <IfModule mod_expires.c> aktiverer Expires-modulen og angir lagringsperioder for hver filtype. Ett år for bilder og fonter, de endres nesten aldri. Én måned for CSS og JavaScript, de oppdateres med jevne mellomrom.

Den andre blokken <IfModule mod_headers.c> legger til den moderne Cache-Control med de samme periodene, men i sekunder: 31536000 = ett år, 2592000 = én måned.

Viktig: mod_expires- og mod_headers-modulene må være aktivert på serveren. På de fleste Apache-hoster er de aktive som standard: supporten aktiverer dem under førstegangsoppsett. Hvis caching ikke fungerer etter lagring, skriv til hosting-supporten: «aktiver mod_expires og mod_headers.»

Etter innliming lagrer du filen og laster den opp til nettstedets rot igjen. Åpne nettstedet i en nettleser, gå til DevTools (F12) → Nettverk → oppdater siden. Klikk på en hvilken som helst CSS- eller JS-fil, i Headers-fanen skal du se Expires og Cache-Control med verdier som ikke er null.

Kjør GTmetrix på nytt, feilen skal være borte.

Metode 2: AEH Speed Optimization-pluginen

Hvis du ikke vil grave i.htaccess manuelt, finnes det en plugin. Den het tidligere bare Add Expires Headers, i dag har den vokst til AEH Speed Optimization. I tillegg til caching-headere kan den gjøre CSS-minifisering, lazy loading av bilder og komprimering.

AEH Speed Optimization-plugin-side i WordPress-katalogen

Installasjonstrinn:

  • Plugins → Legg til ny, i søket skriver du «AEH Speed Optimization»

  • Klikk Installer nå, deretter Aktiver

  • Gå til Innstillinger → AEH Speed Optimization

  • På fanen Cache Settings krysser du av for filtyper og angir lagringsperioder i dager

Bufringsinnstillinger i AEH Speed Optimization-plugin
  • Klikk Send

Pluginen vil skrive regler til.htaccess selv, du trenger ikke skrive en eneste linje kode. For de fleste nettsteder er gratisversjonen nok. Pro-versjonen legger til Gzip-komprimering, caching av eksterne ressurser (Google-fonter, CDN-skript) og egendefinerte filtyper.

Eksempel på lagringsperioder for filgrupper

🔗 AEH Speed Optimization på WordPress.org

Hvis du allerede har en caching-plugin som W3 Total Cache eller WP Rocket, trenger du ikke en separat Expires-plugin. Enhver seriøs cache-plugin kan legge til Expires- og Cache-Control-headere i.htaccess automatisk. Gå til plugin-innstillingene dine og sjekk at fanen Browser Cache er aktiv.

Hvilken caching-tid bør du angi

Det finnes ikke noe universelt svar, perioden avhenger av hvor ofte du endrer en bestemt filtype.

Liste over filtyper for bufringskonfigurasjon i plugin

Filtype

Anbefalt periode

Hvorfor

Bilder (jpg, png, webp, avif, gif, svg)

1 år

Endres sjelden, veier mye, maksimal cache-fordel

Ikoner og favicon

1 år

Endres ikke på årevis

Fonter (woff2, woff)

1 år

Hentes inn én gang og oppdateres ikke

CSS-stiler

1 måned

Du redigerer fra tid til annen; ved redesign, tøm cache

JavaScript

1 måned

Samme logikk som for CSS

PDF og dokumenter

1 måned

Lastes ned sjelden, men kan oppdateres

Generell regel: jo mer stabil filen er, desto lengre periode. For bilder er ett år standard. For CSS og JS er én måned et fornuftig kompromiss mellom hastighet og ferskhet.

Hvis du aktivt utvikler nettstedet og stiler endres hver uke, sett CSS til én uke, ikke en måned. Når du er ferdig med redigeringer, gå tilbake til én måned.

⁉️🤔 Vanlige spørsmål

Jeg la til kode i.htaccess, men GTmetrix viser fortsatt feilen. Hvorfor?

Den vanligste årsaken er at mod_expires- eller mod_headers-modulene ikke er aktivert på serveren. Skriv til hosting-supporten med en forespørsel om å aktivere begge modulene. Andre årsak: du satte inn kode etter # BEGIN WordPress, ikke før. WordPress overskriver alt som kommer etter markøren sin. Tredje, en caching-plugin (W3 Total Cache, WP Rocket) administrerer allerede.htaccess og overskrev reglene dine med sine egne. I så fall konfigurerer du Browser Cache inne i selve pluginen, ikke manuelt.

Hva er forskjellen mellom Expires og Cache-Control?

Expires angir en spesifikk dato og tid («gyldig til 15. juni 2027»). Cache-Control med max-age-direktivet angir varighet i sekunder fra forespørselstidspunktet («gyldig i 31536000 sekunder»). Cache-Control er mer fleksibelt og har prioritet: hvis begge er satt, følger nettleseren Cache-Control. Vi anbefaler å skrive begge for maksimal kompatibilitet med gamle og nye klienter.

Nettstedet ligger på Nginx,.htaccess fungerer ikke. Hva gjør jeg?

.htaccess-filen er Apache-konfigurasjon. Nginx ignorerer den. For Nginx legges caching-regler til i server-delen av nettstedets konfigurasjonsfil med expires-direktivet. Hvis du har Nginx (hoster som Kinsta, Cloudways), bruk AEH Speed Optimization-pluginen: den fungerer på alle webservere fordi den administrerer headere via PHP, ikke via serverkonfigurasjon.

Må jeg konfigurere Expires hvis jeg allerede bruker et CDN?

Ja. Et CDN (Cloudflare, BunnyCDN) cacher innhold på sine servere over hele verden, men nettleser-cache er et separat lag. Riktig konfigurerte Expires og Cache-Control reduserer forespørsler selv til CDN-et: nettleseren går ikke til nettverket i det hele tatt for en fil hvis dens lokale kopi fortsatt er fersk. To cache-lag, CDN + nettleser, jobber sammen, erstatter ikke hverandre.

Kommer AEH Speed Optimization-pluginen i konflikt med cache-pluginen min?

Det kan den hvis begge prøver å skrive regler til.htaccess. Før du installerer AEH Speed Optimization, deaktiver Browser Cache i hoved-cache-pluginen din, eller omvendt, behold én plugin som administrerer både side-cache og nettleser-cache. WP Rocket og W3 Total Cache kan gjøre alt ut av boksen, en separat Expires-plugin er ikke nødvendig med dem.

Bør du konfigurere Expires manuelt, eller er en plugin nok?

Hvis du jobber trygt med FTP og ikke er redd for et koderedigeringsprogram, gir manuell konfigurasjon via.htaccess full kontroll og legger ikke til en ekstra plugin i admin. Koden over: kopier, lim inn, og saken er lukket.

For alle andre løser AEH Speed Optimization-pluginen oppgaven uten risiko for en skrivefeil i konfigurasjonen. I tillegg gir den minifisering og lazy loading, som også øker hastigheten på nettstedet.

Hovedsaken er å ikke la GTmetrix-feilen bli værende som den er. Fem minutter for å konfigurere Expires-headere gir et merkbart hastighetsløft, og hastighet er både brukeropplevelse og søkerangering.