Hopp til innholdet
📌 Slik legger du til et favicon i WordPress: 3 måter for ethvert nettsted

📌 Slik legger du til et favicon i WordPress: 3 måter for ethvert nettsted

Et nettsted uten favicon ser uferdig ut. En besøkende åpner fem faner, leter etter din blant dem, og finner den ikke fordi det i stedet for et ikon er en grå nettleserplassholder. En liten ting? Ja. Men det er disse små tingene som former inntrykket: noen har tatt seg tid til deg eller slengt det sammen i en fei.

WordPress har forenklet det å legge til et nettstedikon til et par klikk, likevel er det halvparten av nettstedeiere som enten ikke kjenner til denne funksjonen eller, etter opplasting, opplever at faviconet ikke vises. Årsaken er nesten alltid nettleserbuffer eller feil filstørrelse.

Nedenfor finner du tre fungerende måter å legge til et favicon i WordPress på: via Tilpasser (den enkleste), manuelt via kode, og via en plugin. Pluss en gjennomgang av krav til størrelse og format slik at ikonet vises overalt: i faner, bokmerker, på iPhone og Android.

💡 Rask oversikt:

  • Hva et favicon er og hvorfor nettstedet ditt trenger ett: merkevaregjenkjenning, tillit, fanenavigasjon
  • Filkrav: et kvadratisk bilde av standard størrelse, PNG-, ICO- eller SVG-format
  • Metode 1: last opp via «Nettsted» → Tilpasser (2 minutter, ingen plugins)
  • Metode 2: manuell innsetting via functions.php eller header.php (for de som redigerer temaer)
  • Metode 3: installer Site Favicon-pluginen (hvis Tilpasser ikke er tilgjengelig)
  • Hva du gjør hvis faviconet ikke vises: nettleserbuffer, gammel ICO, CDN

Hvorfor nettstedet ditt trenger et favicon og hva kravene er

Et favicon (forkortelse for favorite icon) er et lite ikon som nettleseren viser til venstre for sidetittelen i fanen, i bokmerker og i nettleserhistorikk. En bruker med et dusin åpne faner finner nettstedet ditt på et brøkdels sekund ved hjelp av synet, nettopp på grunn av faviconet, ikke på grunn av tittelteksten.

Den andre funksjonen er mindre åpenbar: faviconet bidrar til å bygge en mikro-merkevare. Når noen bokmerker en side eller legger nettstedet til på smarttelefonens startskjerm, er det nettstedikonet som vises der. Uten ett setter WordPress inn enten en grå plassholder eller et skjermbilde av siden, noe som ser slurvete ut.

Krav til størrelse og format

Siden 2014 har WordPress støttet opplasting av et nettstedikon via Tilpasser. Kravene er standard:

  • Størrelse: 512×512 piksler. WordPress genererer automatisk nedskalerte kopier for nettlesere (32×32, 180×180 for Apple touch-ikon, 192×192 og 512×512 for Android). Du trenger ikke laste opp separate filer for hver oppløsning; kjernen gjør det selv. Mer om krav til nettstedikon i den offisielle WordPress-dokumentasjonen.
  • Format: PNG (anbefales), ICO eller SVG. PNG gir best kvalitet på retina-skjermer. ICO, et gammeldags format for gamle nettlesere, er praktisk talt unødvendig i 2026.
  • Hva du bør bruke som favicon: en logo som er gjenkjennelig i et kvadrat og lesbar når den skaleres betydelig ned. Tre eller fire bokstaver med tekst på en farget bakgrunn fungerer bedre enn en kompleks illustrasjon.

Hovedregelen når du klargjør filen: den må være kvadratisk. WordPress vil tvangsbeskjære et ikke-kvadratisk bilde, og resultatet blir kanskje ikke slik du ønsker.


Slik legger du til et favicon i WordPress: 3 metoder

Metode 1: via Tilpasser, den enkleste

Denne metoden fungerer på enhver moderne versjon av WordPress med et klassisk tema. For blokktemaer (FSE) er veien litt annerledes; jeg viser begge.

Klassisk tema (Tilpasser):

  • Logg inn på WordPress-administrasjonen.
  • Gå til Utseende → Tilpass.
  • Velg delen Nettstedsidentitet. I noen temaer kalles den «Nettstedsinformasjon» eller «Nettstedikon og logo».
  • Finn feltet Nettstedikon. Klikk «Velg nettstedikon» og last opp en kvadratisk PNG; WordPress forventer et bilde på minst 512×512, ifølge dokumentasjonen.
  • Beskjær bildet om nødvendig ved hjelp av den innebygde redigereren og klikk «Lagre endringer».

Blokktema (Nettstedsredigering, WordPress 5.9+):

Hvis temaet støtter Fullstendig nettstedsredigering, erstattes Tilpasser av Nettstedsredigering. Gå til Utseende → Rediger, åpne Stiler-panelet eller Innstillinger, finn Nettstedikon-delen og last opp det samme kvadratiske bildet. Logikken er den samme, grensesnittet er annerledes.

Etter lagring åpner du nettstedet i et nytt privat nettleservindu; faviconet skal vises i fanen. Hvis det ikke vises umiddelbart, ikke få panikk: nettlesere mellomlagrer faviconer aggressivt. Mer om dette i FAQ-delen nedenfor.

Metode 2: manuelt via functions.php

Et alternativ for de som redigerer et child theme og ikke vil være avhengige av Tilpasser. Legg til følgende kode i child themeets functions.php eller via Code Snippets-pluginen:

1/**
2 * Include favicon via wp_head.
3 * The favicon.png file should be in the root of the child theme.
4 */
5add_action( 'wp_head', 'sdstudio_add_favicon' );
6
7function sdstudio_add_favicon() {
8 $favicon_url = get_stylesheet_directory_uri() . '/favicon.png';
9 echo '<link rel="icon" href="' . esc_url( $favicon_url ) . '" type="image/png" sizes="512x512">' . "\n";
10 echo '<link rel="apple-touch-icon" href="' . esc_url( $favicon_url ) . '" sizes="180x180">' . "\n";
11}

Det som skjer her: wp_head-hooken setter inn to <link>-tagger i <head> på hver side. Den første er et standard favicon for nettlesere, den andre er et Apple touch-ikon for Apple-enheter (iPhone, iPad). Funksjonen get_stylesheet_directory_uri() returnerer URL-en til child themeet; faviconet må plasseres der, i roten av temamappen.

Det er ikke nødvendig å gi filen nytt navn til favicon.ico. WordPress fungerer fint med PNG, og nettlesere forstår det uten problemer. Hovedsaken er et kvadrat av standard størrelse.

Hvis du lenker til faviconet ikke fra temaet, men fra nettstedets rot, erstatt get_stylesheet_directory_uri() med home_url() og juster banen:

1$favicon_url = home_url( '/favicon.png' );

Etter at du har lagt til koden, last opp favicon.png til den tilsvarende mappen via FTP eller hostingens filbehandler. Sjekk resultatet i et privat nettleservindu.

Metode 3: via en plugin

Hvis Tilpasser av en eller annen grunn ikke lar deg laste opp et nettstedikon (dette skjer i tilpassede og utdaterte temaer), installer Site Favicon-pluginen, som er minimalistisk og gratis. Installer den på standard måte: Plugins → Legg til ny → søk «Site Favicon» → Installer → Aktiver. Etter aktivering vises et menyvalg Innstillinger → Site Favicon i administrasjonen, der du kan laste opp et ikon og se en forhåndsvisning umiddelbart.

Et annet alternativ er All in One SEO. Hvis SEO-pluginen allerede er på nettstedet, sjekk innstillingene dens: det er en seksjon for opplasting av nettstedikon der som gjør det samme uten en ekstra plugin. Men vi anbefaler ikke å installere en tung SEO-pakke bare for et favicon; Site Favicon håndterer oppgaven, veier mindre og legger ikke til ekstra belastning.

Etter at du har satt opp faviconet ved hjelp av en av de tre metodene, bekreft at ikonet faktisk vises: åpne nettstedet i inkognitomodus og se på nettleserfanen.

Videoen ovenfor er en trinnvis demonstrasjon av alle tre metodene på et live WordPress-nettsted. Hvis du etter å ha lest fortsatt er i tvil om noen av trinnene, se videoen: ved 1:15 viser de opplastingen via Tilpasser, ved 3:40 den manuelle metoden.


⁉️🤔 Ofte stilte spørsmål

Hvorfor vises ikke faviconet etter opplasting via Tilpasser?

I de fleste tilfeller er problemet nettleserbuffer. Faviconer mellomlagres aggressivt; nettleseren kan holde på den gamle versjonen i flere dager. Åpne nettstedet i inkognitomodus (Ctrl+Shift+N i Chrome): hvis ikonet vises, ligger problemet faktisk i bufferen. Tøm nettleserbufferen eller vent til den utløper naturlig. Den nest vanligste årsaken er at faviconet ble lastet opp i ICO-format mens nettleseren forventer PNG. WordPress siden versjon 4.3 foretrekker PNG; last opp et kvadrat av standard størrelse i PNG, slik dokumentasjonen krever, så forsvinner problemet.

Kan jeg bruke logoen min som favicon?

Det kan du og bør du; det er standard praksis. Men ikke enhver logo egner seg. Sjekk hvordan logoen din ser ut i liten skala: hvis detaljene flyter sammen til en uleselig klatt, lag en forenklet versjon. Et godt eksempel er WordPress-ikonet (W på blå bakgrunn): gjenkjennelig selv i ørliten størrelse. En horisontal logo med ti bokstaver tekst vil bli en grå stripe når den skaleres betydelig ned; for faviconet, bruk bare merket uten teksten.

Hvorfor krever WordPress et favicon av akkurat denne størrelsen?

For WordPress, ja. Kjernen aksepterer akkurat denne størrelsen som kilde og genererer alle nødvendige nedskalerte kopier automatisk; den offisielle dokumentasjonen bekrefter minimumskravet på 512 piksler på hver side. Hvis du laster opp et mindre favicon (for eksempel 128×128), vil oppskalering til 512 piksler skje med kvalitetstap, og på retina-skjermer vil ikonet se uskarpt ut. Unntaket er hvis du lenker til faviconet manuelt via kode (metode 2): da kan du forberede flere størrelser og spesifisere dem med separate <link>-tagger.

Hvordan fjerner eller erstatter jeg et favicon?

Erstatning gjøres via det samme grensesnittet der du lastet det opp: Tilpasser → Nettstedsidentitet → Nettstedikon → «Fjern» og last deretter opp et nytt. Det gamle ikonet vil henge igjen i nettleserbufferen en stund (opptil flere dager); dette er normalt. For fullstendig fjerning, bruk «Fjern»-knappen i det samme grensesnittet, hvoretter WordPress vil slutte å sende ut favicon-tagger og nettleseren vil gå tilbake til den grå plassholderen.

Påvirker et favicon SEO?

Direkte, nei. Google bruker ikke tilstedeværelsen eller fraværet av et favicon som en rangeringsfaktor. Indirekte, ja: et nettsted med et favicon ser mer profesjonelt ut, og brukere er mindre tilbøyelige til å forveksle det med konkurrenter når de navigerer i faner. Dette reduserer pogo-sticking-raten (retur til søkeresultatene), noe søkemotorer tar hensyn til indirekte. I tillegg viser Google noen ganger faviconer i mobile søkeresultater; ikonet gjør snippet-en mer visuelt iøynefallende, noe som forbedrer CTR.


Hvilken metode du bør velge: en kort algoritme

Hvis du har et standardtema med Tilpasser, bruk metode 1. Det er to klikk, og WordPress håndterer alt det tekniske arbeidet: endring av størrelse, taggenerering, Apple- og Android-støtte. Ni av ti WordPress-nettsteder løser favicon-spørsmålet på akkurat denne måten.

Et tilpasset tema uten støtte for nettstedikon? Lenk det via functions.php (metode 2); koden på tre linjer gir deg full kontroll over størrelser og format. Spar pluginen (metode 3) til tilfeller der verken Tilpasser eller temaredigering er tilgjengelig, for eksempel hvis nettstedet er på en multisite-installasjon med begrensede tillatelser eller du jobber med et byggeverktøy som ikke gir tilgang til functions.php.

Og viktigst av alt: etter at du har lastet opp faviconet, sjekk nettstedet i et nytt nettleservindu i inkognitomodus. Ikke stol på et vanlig vindu; den gamle versjonen eller selve plassholderen kan være mellomlagret der. Ser du ikonet i fanen? Da er du ferdig.