Sådan tilføjer du et baggrundsbillede i WordPress

Undrer du dig over, hvordan du tilføjer et baggrundsbillede til dit WordPress-websted?

Baggrundsbilleder kan bruges på en række forskellige websteder for at gøre dem mere indtagende og forbedre dit websteds design.

Vi viser dig trin for trin, hvordan du nemt kan tilføje et baggrundsbillede til dit WordPress-websted.

Indholdsfortegnelse

1. Tilføj et baggrundsbillede via WordPress-temaindstillinger

De fleste WordPress-temaer tilbyder understøttelse af brugerdefineret baggrund. Det betyder, at du nemt kan ændre baggrundsbilledet på dit WordPress-websted.

Dette er nok den enkleste måde at tilføje en baggrund på, så hvis dit WordPress-tema understøtter dette, kan du fortsætte med denne metode.

Hvis dit tema ikke tilbyder denne funktion, har vi masser af andre metoder nedenfor, som du kan følge.

Naviger til Udseende > Tilpas i dit WordPress-administrationsinstrumentbræt. Dette fører dig til WordPress-temaets tilpasningsværktøj. Her kan du ændre dine temaindstillinger med et live preview for at se ændringerne på dit website.

Under fanen Farver og baggrunde kan du vælge et baggrundsbillede eller ændre baggrundsfarve og mønster. Find knappen“Vælg billede“, og klik på den.

Du vil nu se dit WordPress-mediebibliotek, hvor du kan uploade et billede fra din computer eller vælge et billede fra dit mediebibliotek, som du kan anvende som baggrundsbillede på dit WordPress-websted.

Klik på det billede, du ønsker at indstille som baggrundsbillede, og tryk på “Vælg billede” for at fortsætte. Dette vil nu lukke mediebiblioteket, og det valgte billede vil blive vist i preview-sektionen i temaets brugerdefinerator.

Du kan yderligere tilpasse dit baggrundsbillede ved at vælge“Indstillinger“. Her kan du se muligheden for at placere dit billede, gentage det (hvis det ikke er stort nok) og meget mere.

2. Brug et plugin til at tilpasse baggrundsbilledet i WordPress

Hvis dit tema ikke giver dig mulighed for at tilpasse baggrundsbilledet via tematilpasseren, kan du bruge et plugin, som fungerer med alle temaer.

Full Screen Background Pro-plugin giver dig mulighed for at indstille baggrunde til ethvert indlæg, side eller enhver anden del af dit WordPress-websted.

Alle billeder vil automatisk blive gjort til fuld skærm og mobil responsive, hvilket er meget svært at opnå via temaets customizer.

Installer først plugin’et Full Screen Background Pro. Når det er installeret, skal du aktivere plugin’et.

Naviger til Udseende > Full Screen BG Image , hvor du kan konfigurere plugin-indstillingerne.

Dette plugin er et premium-plugin og er derfor ikke gratis. Når du navigerer til ovenstående sted, kan du blive bedt om at indtaste din licensnøgle. Dette kan findes i den e-mail, du modtog efter at have købt plugin’et.

Klik på“Save Settings” (Gem indstillinger) for at gemme dine ændringer. Nu er du klar til at begynde at tilføje baggrundsbilleder til dine WordPress-sider, -indlæg og -kategorier.

Vælg “Tilføj billede” på plugin’ets indstillingsside. Ligesom vi gjorde det i metode et, skal du vælge “Vælg billede” for at starte mediebiblioteket i WordPress.

Du skal tilføje et billednavn, men det vil kun blive vist i WordPress’ backend, så giv det et navn, der er relevant for billedet.

Vælg, hvor du vil have billedet vist:

  • Global
  • Kategori
  • Archives
  • Sider
  • Stillinger
  • Blog
  • Forside
  • Søg på
  • 404
  • Login
Klik på “Gem billede” for at gemme dit nye baggrundsbillede. Du kan tilføje flere billeder ved at gå tilbage til Udseende > Fuld skærm BG-billede.
Hvis du har valgt mere end ét billede, vil plugin’et vise baggrundsbillederne som et diasshow. Du kan justere indstillingerne for diasshowet via indstillingen “fadein-effekter”.

3. Tilføj et baggrundsbillede via CSS Hero

CSS Hero er et WordPress-plugin, der gør det muligt at ændre temaet på dit WordPress-websted uden kodning.

Dette er en perfekt mulighed for begyndere, der ønsker mere fleksibilitet end den, som temaets tilpasningsværktøj tilbyder, men som måske ikke er forberedt på andre mere komplicerede metoder.

Installer og aktiver CSS Hero, og gå derefter til din hjemmeside på din internetbrwoser. Øverst kan du se muligheden for at“Tilpas med CSS Hero“; klik på dette link i din administrationslinje.

CSS Hero er et premium-plugin med abonnementer fra $19 pr. år. Hvis du kun skal tilpasse ét websted, kan du vælge Starter-indstillingen.

Når du har klikket på knappen i administrationslinjen, får du CSS Hero-mulighederne. Før musen hen over det område, du vil ændre baggrundsbilledet på.

Vælg baggrundslinket i venstre sidebar og vælg derefter “Image” (billede). Du kan uploade dine egne billeder eller vælge et fra Unsplash, som er et gratis websted med stockfotos.

Når du har fundet det billede, du vil tilføje som baggrundsbillede til dit WordPress-websted, skal du vælge “Anvend billede”. Du kan justere størrelsen på dit billede og meget mere via indstillingerne.

Hvis du er klar til at se dit nye baggrundsbillede i aktion, skal du klikke på “Gem og offentliggør”. CSS Hero fungerer sammen med en række andre plugins som Elementor, så sørg for at tjekke kompatibiliteten, før du køber det.

4. Tilføj et baggrundsbillede ved hjælp af CSS

WordPress tilføjer som standard CSS-klasser til de forskellige elementer på dit WordPress-websted. Hvis du er klar til at eksperimentere med CSS-kode, er denne metode måske den bedste for dig.

Hvis du har en kategori på dit WordPress-websted, der hedder “Anmeldelser”, vil CSS-klasser automatisk blive tilføjet, når denne kategoriside vises.

Naviger til en kategoriside, højreklik med musen, og vælg derefter “Inspicere”. Du vil kunne se de CSS-klasser, som WordPress har tilføjet.

I dette eksempel kan du brugeCSS-klassen category-reviews til atstyle denne kategori anderledes end alle andre kategorier på dit WordPress-websted.

Tilføj følgende brugerdefinerede CSS til dit tema, og husk at erstatte kategorien og baggrundsbilledet efter dine egne krav.

1
2
3
4
5
6
7
body.category-reviews {
background-image: url("http://example.com/wp-content/uploads/2019/03/your-background-image.jpg");
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
}

5. Roundup

Vi håber, at denne artikel har været nyttig til at lære dig, hvordan du tilføjer et baggrundsbillede i WordPress. Du kan finde flere WordPress-vejledninger på vores blogside og bruge søgefunktionen til at finde flere WordPress-vejledninger!