Stel een achtergrondafbeelding in voor uw WordPress-Website

elke afbeelding of video die u op uw website gebruikt, definieert uw merk voor uw publiek. Dus achtergrondafbeeldingen op uw website zijn belangrijk, en je moet ontwerpen of kiezen ze houden in het oog van uw merk stijl en doelgroep.

in deze tutorial leert u een aantal manieren om een achtergrondafbeelding in te stellen op uw WordPress website. Ik neem u mee door het proces van het instellen van uw WordPress achtergrondafbeelding in detail, zodat u het gemakkelijk zelf kunt doen.

of u uw WordPress site host met WordPress.com of gebruik maken van een self-managed server, deze tutorial is voor jou. U leert de volgende methoden voor het instellen van een achtergrondafbeelding voor uw WordPress website:

  • een achtergrondafbeelding toevoegen met instellingen voor WordPress thema
  • een achtergrondafbeelding toevoegen met WordPress plugins
  • achtergrondfoto ‘ s toevoegen met CSS

Optie 1. Voeg een achtergrondafbeelding toe met WordPress Thema instellingen

veel Gratis WordPress thema ‘ s laten u een achtergrondafbeelding instellen. Ik gebruik de Twenty Twenty-One thema, dat is een eenvoudige go-to thema voor blogs, portefeuilles, en kleine bedrijven. Met dit thema kunt u ook een achtergrondafbeelding hebben.

Meld u aan bij de admin sectie van uw WordPress site. U kunt omgaan met de meeste van uw WordPress instellingen vanaf hier.

  • WordPress
    inloggen op uw WordPress Site Admin Dashboard
    Adi Purdila

klik op uiterlijk, waarin alle instellingen voor hoe uw website eruit ziet. Je wordt gevraagd om een thema te kiezen. Kies twintig eenentwintig als uw thema(of een ander thema dat u toelaat om een achtergrondafbeelding).

beweeg nu de muisaanwijzer over het menu uiterlijk en klik op Achtergrond. Het thema Customizer venster verschijnt en laat u een achtergrondafbeelding te kiezen.

achtergrondafbeeldingachtergrondafbeeldingachtergrondafbeelding

Selecteer nu afbeelding en kies een afbeelding uit uw WordPress-bibliotheek of upload een afbeelding.

u kunt de details van uw achtergrondafbeelding instellen, zoals de alt-tekst, titel, bijschrift en beschrijving. Als je focus SEO is, is het altijd een geweldig idee om alt-tekst toe te voegen.

details van achtergrondafbeeldingdetails van achtergrondafbeeldingdetails van achtergrondafbeelding

zodra u de afbeelding hebt gekozen en de instellingen hebt opgeslagen, verandert uw WordPress-achtergrondafbeelding. Nu, kunt u de verschillende vooraf ingestelde opties verkennen (vul scherm, Fit to Screen, enz.), die u zal toestaan om uw achtergrondafbeelding kijken precies hoe u wilt.

VoorinstellingenVoorinstellingenVoorinstellingen

vergeet niet op de knop Wijzigingen opslaan linksboven te klikken, anders worden uw wijzigingen niet opgeslagen.

Optie 2. Voeg een achtergrondafbeelding toe met behulp van WordPress Plugins

plugins gebruiken om wijzigingen aan te brengen in het uiterlijk van uw website wordt alleen aanbevolen als u een zelf beheerde WordPress site hebt of als u hebt geïnvesteerd in een betaald abonnement van WordPress.com. als u ervoor kiest om plugins te gebruiken met uw gratis WordPress.com account, uw domein zal veranderen van .wordpress.com aan .wpcomstaging.com, wat niet ideaal is.

Plugins bieden veel functies en functionaliteit voor uw WordPress site. Bijvoorbeeld, met een achtergrond plugin, kunt u verschillende achtergronden toe te voegen in meerdere gebieden van uw website: berichten, pagina ‘ s, en categorieën. U kunt ook een YouTube-video als achtergrond instellen met één plugin. Plug-ins kunnen ook de grootte van uw afbeeldingen en video ‘ s voor telefoons, zodat uw publiek gemakkelijk kan genieten van uw website vanaf hun telefoons.

  • WordPress
    Wat Is een WordPress Plugin?
    Rachel McCollin
  • WordPress
    17 beste Videoachtergrondplug-ins voor WordPress
    Nona Blackman

voor deze tutorial, we zijn met behulp van een zeer eenvoudige gratis plugin. Het heet de eenvoudige Full Screen achtergrondafbeelding plugin.

zodra u de plugin hebt geactiveerd, beweeg uw muis over het uiterlijk. Klik nu op de nieuwe optie, BG-afbeelding op Volledig scherm.

BG-afbeelding op Volledig schermBG-afbeelding op Volledig schermBG-afbeelding op Volledig scherm

klik vervolgens op afbeelding kiezen en upload de afbeelding die u wilt als uw WordPress-achtergrondafbeelding. U kunt ook een afbeelding uit uw mediabibliotheek kiezen als u daar eerder uw favoriete achtergrondafbeelding hebt toegevoegd.

kies Afbeeldingkies Afbeeldingkies Afbeelding

u kunt desgewenst details toevoegen zoals alt-tekst, bijschrift en beschrijving van de afbeelding. Klik op afbeelding gebruiken en sla opties op.

ga nu naar uw website om te zien hoe uw WordPress achtergrondafbeelding eruit ziet.

optie 3. Achtergrondfoto ‘ s toevoegen met behulp van CSS

nogmaals, om een achtergrondafbeelding toe te voegen met behulp van CSS, moet u een self-hosted WordPress site hebben, of zich abonneren op een betaald abonnement op WordPress.com. Custom CSS zal niet alleen kunt u een achtergrondafbeelding toe te voegen, maar u kunt ook verschillende wijzigingen in het uiterlijk van uw website om het er precies hoe u wilt.

Navigeer naar het WordPress dashboard en klik op uiterlijk > extra CSS.

Additional CSSAdditional CSSAdditional CSS

Voeg nu deze regels code toe in het CSS-veld om een WordPress achtergrondafbeelding in te stellen.

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

vervang http://theimageurl door de URL van de afbeelding die u wilt gebruiken als WordPress achtergrondafbeelding.

u kunt ook aangepaste achtergronden en afbeeldingen toevoegen aan individuele berichten op uw WordPress website. Om dat te doen, heb je deze code nodig:

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

net als voorheen moet u http://anotherimageurl vervangen door de URL van de afbeelding die u wilt gebruiken. U moet ook slug vervangen door de naam van een bestaande categorie op uw site.

als u klaar bent met het maken van de wijzigingen in CSS, vergeet dan niet op de knop Wijzigingen opslaan te klikken om alle wijzigingen op te slaan. Nu kunt u uw site bezoeken om de nieuwe achtergrondafbeelding te bekijken!

let op de afbeeldingsgrootte

voordat u een afbeelding uploadt naar uw WordPress site, focus op de grootte. Het is verleidelijk om een beeld van hoge kwaliteit toe te voegen. Dit kan echter de laadsnelheid van uw website verhogen. Het klinkt niet als een big deal; echter, hoe langzamer uw site is, hoe groter de bounce rate, wat betekent dat meer mensen uw website verlaten voordat u de inhoud ervan leest of ziet. Dit, op zijn beurt, beïnvloedt uw conversies. Google heeft gezegd dat twee seconden is de ideale site snelheid, vooral als je een bedrijf.

aan de andere kant kan het toevoegen van afbeeldingen van slechte kwaliteit alleen maar om een kleiner formaat te hebben ook een negatieve invloed hebben op de gebruikerservaring. Dus de ideale praktijk is om een balans te houden en foto ‘ s van goede kwaliteit toe te voegen, maar alleen wanneer dat nodig is—dat is wanneer ze waarde toevoegen aan uw inhoud, en alleen aan de resolutie die nodig is.

samenvatting

In deze tutorial liet ik u drie manieren zien om de WordPress achtergrondafbeelding in te stellen.

  1. een achtergrondafbeelding toevoegen via de instellingen voor het thema-uiterlijk
  2. een plugin gebruiken om de achtergrondafbeelding toe te voegen
  3. aangepaste CSS

u hebt mogelijk al dan niet een achtergrondafbeelding nodig voor uw WordPress-website. Echter, als u ervoor kiest om een achtergrondafbeelding te hebben, weet dat het een belangrijk element is dat uw merkstijl voor uw publiek stelt. Dus zorg ervoor dat uw WordPress achtergrondafbeelding weerspiegelt uw merkimago.

Leave a Reply