Articles /

Ange en bakgrundsbild för din WordPress-webbplats

varje bild eller video du använder på din webbplats definierar ditt varumärke för din publik. Så bakgrundsbilder på din webbplats är viktiga, och du bör designa eller välja dem med tanke på din varumärkesstil och målgrupp.

i denna handledning lär du dig ett antal sätt att ställa in en bakgrundsbild på din WordPress-webbplats. Jag tar dig igenom processen att ställa in din WordPress-bakgrundsbild i detalj så att du enkelt kan göra det själv.

oavsett om du är värd för din WordPress-webbplats med WordPress.com eller använder en självhanterad server, den här handledningen är för dig. Du lär dig följande metoder för att ställa in en bakgrundsbild för din WordPress-webbplats:

  • Lägg till en bakgrundsbild med WordPress – temainställningar
  • Lägg till en bakgrundsbild med WordPress-plugins
  • Lägg till bakgrundsbilder med CSS

alternativ 1. Lägg till en bakgrundsbild med WordPress-Temainställningar

många gratis WordPress-teman låter dig ställa in en bakgrundsbild. Jag använder Twenty Twenty-One-temat, vilket är ett enkelt go-to-tema för bloggar, portföljer och småföretag. Detta tema låter dig också ha en bakgrundsbild.

logga in på admin-avsnittet på din WordPress-webbplats. Du kan hantera de flesta av dina WordPress-inställningar härifrån.

  • WordPress
    hur du loggar in på din WordPress Site Admin Dashboard
    Adi Purdila

klicka på utseende, som innehåller alla inställningar för hur din webbplats ser ut. Du kommer att bli ombedd att välja ett tema. Välj tjugo tjugo som ditt tema (eller något annat tema som låter dig få en bakgrundsbild).

håll muspekaren över menyn Utseende och klicka på bakgrund. Fönstret theme Customizer visas och låter dig välja en bakgrundsbild.

bakgrundsbildbakgrundsbildbakgrundsbild

Välj nu Bild och välj antingen en bild från ditt WordPress-bibliotek eller ladda upp en bild.

du kan ställa in detaljerna för din bakgrundsbild, som alt-text, titel, bildtext och beskrivning. Om ditt fokus är SEO är det alltid bra att lägga till alt-text.

detaljer om bakgrundsbilddetaljer om bakgrundsbilddetaljer om bakgrundsbild

när du har valt bilden och sparat inställningarna ändras din WordPress-bakgrundsbild. Nu kan du utforska de olika förinställda alternativen (fyll skärm, Anpassa till skärm, etc.), vilket gör att du kan få din bakgrundsbild att se exakt hur du vill ha den.

förinställda inställningarförinställda inställningarförinställda inställningar

kom ihåg att klicka på knappen Spara ändringar längst upp till vänster, annars sparas inte dina ändringar.

alternativ 2. Lägg till en bakgrundsbild med WordPress-Plugins

använda plugins för att göra ändringar i utseendet på din webbplats rekommenderas endast om du har en Självhanterad WordPress-webbplats eller om du har investerat i en betald plan från WordPress.com. om du väljer att använda plugins med din gratis WordPress.com konto, din domän kommer att ändras från .wordpress.com till .wpcomstaging.med, vilket inte är idealiskt.

Plugins erbjuder många funktioner och funktionalitet för din WordPress-webbplats. Med ett bakgrundsplugin kan du till exempel lägga till olika bakgrunder på flera områden på din webbplats: inlägg, sidor och kategorier. Du kan också ställa in en YouTube-video som bakgrund med ett plugin. Plugins kan också ändra storlek på dina bilder och videor för telefoner så att din publik enkelt kan njuta av din webbplats från sina telefoner.

  • WordPress
    Vad är en WordPress Plugin?
    Rachel McCollin
  • WordPress
    17 bästa Videobakgrunds Plugins för WordPress
    Nona Blackman

för denna handledning använder vi ett mycket grundläggande gratis plugin. Det kallas det enkla fullskärmsbildsplugin för bakgrundsbild.

när du har aktiverat plugin, håll musen över utseende. Klicka nu på det nya alternativet, Fullscreen bg Image.

bg-bild i fullskärmbg-bild i fullskärmbg-bild i fullskärm

klicka sedan på Välj bild och ladda upp den bild du vill ha som din WordPress-bakgrundsbild. Du kan också välja en bild från ditt mediebibliotek om du tidigare har lagt till din önskade bakgrundsbild där.

Välj bildVälj bildVälj bild

du kan lägga till detaljer som alt text, bildtext och beskrivning av bilden om du vill. Klicka på Använd bild och sedan på Spara alternativ.

gå nu till din webbplats för att se hur din WordPress-bakgrundsbild ser ut.

alternativ 3. Lägg till bakgrundsbilder med CSS

återigen, för att lägga till en bakgrundsbild med CSS måste du ha en egen värd WordPress-webbplats eller prenumerera på en betald plan på WordPress.com. Anpassad CSS låter dig inte bara lägga till en bakgrundsbild, men du kan också göra olika förändringar i utseendet på din webbplats så att den ser exakt ut som du vill.

navigera till WordPress-instrumentpanelen och klicka på utseende > ytterligare CSS.

ytterligare CSSytterligare CSSytterligare CSS

lägg nu till dessa rader kod i CSS-fältet för att ställa in en WordPress-bakgrundsbild.

body { background-image: url("https://theimageurl"); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}

ersätt http://theimageurl med webbadressen till bilden du vill använda som din WordPress-bakgrundsbild.

du kan också lägga till anpassade bakgrunder och bilder till enskilda inlägg på din WordPress-webbplats. För att göra det behöver du den här koden:

body.category-slug { background-image: url("http://anotherimageurl"); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}

precis som tidigare måste du ersätta http://anotherimageurl med webbadressen till bilden du vill använda. Du måste också ersätta slug med namnet på en befintlig kategori på din webbplats.

när du är klar med att göra ändringarna i CSS, glöm inte att klicka på knappen Spara ändringar för att lagra alla ändringar. Nu kan du besöka din webbplats för att se den nya bakgrundsbilden!

Var uppmärksam på bildstorleken

innan du laddar upp en bild till din WordPress-webbplats, fokusera på dess storlek. Det är frestande att lägga till en högkvalitativ visuell. Detta kan dock öka laddningshastigheten på din webbplats. Det låter inte som en stor sak; men ju långsammare din webbplats är, desto större är avvisningsfrekvensen, vilket innebär att fler lämnar din webbplats innan de läser eller ser innehållet. Detta påverkar i sin tur dina konverteringar. Google har sagt att två sekunder är den perfekta webbplatshastigheten, särskilt om du driver ett företag.

men å andra sidan kan tillägg av bilder av dålig kvalitet bara för att ha en mindre storlek också påverka användarupplevelsen negativt. Så den perfekta övningen är att hålla balans och lägga till bilder av god kvalitet men bara när det behövs—det är när de tillför värde till ditt innehåll och bara till den upplösning som behövs.

sammanfattning

i denna handledning visade jag dig tre sätt att ställa in WordPress-bakgrundsbilden.

  1. lägga till en bakgrundsbild genom inställningarna för temautseende
  2. använda ett plugin för att lägga till bakgrundsbilden
  3. lägga till anpassad CSS

du kanske eller kanske inte behöver en bakgrundsbild för din WordPress-webbplats. Men om du väljer att ha en bakgrundsbild, vet att det är ett viktigt element som sätter din varumärkesstil för din publik. Så se till att din WordPress-bakgrundsbild återspeglar din varumärkesbild.

Leave a Reply