Hvordan enkelt legge inn tilpasset CSS-kode i WordPress

av naldy

Noen ganger når du ønsker å tilpasse utseendet på noe, trenger du å legge inn tilpasset CSS-kode i WordPress. Det er ikke så komplisert som det høres ut, du kan fint legge inn denne koden uten å bruke FTP, SSH eller redigere temafiler.

Legg inn CSS-kode fra tema-tilpasseren

I nyere utgave av WordPress kan du legge inn tilpasset CSS-kode direkte fra kontrollpanelet. Dette er veldig enkelt, og du vil kunne se endringene du gjør fortløpende fra forhåndsvisningen.

Gå til Utseende > Tilpass fra kontrollpanelet.

Sett inn CSS-kode fra tilpass i WordPress

Når du trykker på «Tilpass» vil tema-tilpasseren vise. Du vil se hvordan nettstedet ser ut i forhåndvisningen til høyre. Til venstre i vinduet, kan du se alternativer og ulike menyvalg for å tilpasse temaet du bruker.

Bla deg nedover i listen til du ser «Ekstra CSS». Klikk på den for å skrive inn CSS-koden du ønsker. Når du er fornøyd med hvordan det ser ut, må du ikke glemme å klikke på «Publiser» for å lagre endringer.

CSS-kode eksempel for å endre tittel

I eksempelet ovenfor, brukte vi denne koden for å endre hvordan H2-tittelen ser ut på demonettsiden vår:

h2 { 
	color: #111; 
	font-family: 'Lucida Sans', Arial, Sans-Serif;
	font-weight: bold; 
	letter-spacing: -1px; 
	line-height: 1;
}

Når du legger inn tilpasset CSS-kode ved å bruke tema-tilpasseren i WordPress, er den koden bare tilgjengelig med det aktuelle temaet du bruker.

Hvis du vil bruke koden i et annet tema, må du kopiere og lime inn koden etter at du har aktivert nytt tema.

Legg inn CSS-kode med en utvidelse (plugin)

Metoden ovenfor lar deg bare lagre tilpasset CSS-kode for det aktive temaet. Hvis du endrer tema, må du kanskje kopiere og lime inn mye kode til det nye temaet.

Hvis du derimot bruker en utvidelse, vil du ikke trenge å lime inn koden på nytt om du skifter tema.

Det første du trenger å gjøre, er å installere og aktivere utvidelsen Simple Custom CSS. Les hvordan installere en utvidelse for mer informasjon.

Når du har aktivert utvidelsen, kan du gå til Utseende > Custom CSS. Skriv inn CSS-koden du ønsker å bruke, klikk deretter på «Update Custom CSS» for å lagre endringer.

Custom CSS plugin

Har du spørsmål eller tilbakemeldinger, hører vi gjerne fra deg i kommentarfeltet under eller bruk kontaktskjemaet. Vi svarer på alle henvendelser.

Kanskje du liker

Skriv en kommentar

* Vennligst gjør deg kjent med vår personvernerklæring.

Vi benytter cookies for utvidet funksjonalitet, bedre nettleser-opplevelse, statistikk og målrettede annonser. OK Les mer

HOLD DEG OPPDATERT

MELD DEG PÅ NYHETSBREV

Sendes ut ca. hver 3. måned.