Hvordan løse utfordringen med bakgrunnsbilder?

Hvordan løse utfordringen med bakgrunnsbilder?

Hvilken utfordring?

Den med personer og kroppsdeler som forsvinner ut av skjermen!

I gamle dager, når alle hadde en standard skjerm til pc, så var ikke dette noen utfordring. Men nå kan du se nettsider på alt fra mobil til en mega stor skjerm. Da må også all tekst kunne leses på alle skjermstørrelser. Og ligger teksten på et bakgrunnsbilde, så er det ikke til å unngå at deler av bildet ikke vises. Men, det finnes måter å løse det på 😉 Les videre og se videoen over!

Dette er det spørsmålet vi får oftest på WP Skolen:

Hvorfor vises ikke hele bakgrunnsbildet?

Bakgrunnsbilder

Det er så enkelt som at teksten er fokus, ikke bildet. Bildet vil alltid tilpasses teksten som ligger oppå, ikke motsatt. Her et eksempel fra mobilskjerm.

Og under, et eksempel med samme bilde fra desktop størrelse på skjerm:

Men dette kan løses ved å velge ulike bilder, ett for desktop og ett for mobil/nettbrett. Dette løses veldig enkelt med en plugin som heter EditorsKit. Installer og aktiver den, og du vil få opp valget «Responsive» på alle slags blokker(nesten).

I videoen over har jeg lagt inn to «Omslag» blokker, men valgt ulike innstillinger for visning under «Responsive» valget.

Det første omslaget har et bilde som er egnet for desktop, men på mobil vil ingen av oss bli med på bildet. Derfor lar jeg «Hide on desktop»(1) stå, men aktiverer «Hide on mobile» og «Hide on tablet»(2):

På omslag nr 2 gjør jeg motsatt, aktiverer «Hide on desktop»(1) og lar «Hide on tablet» og «Hide on mobile»(2):

Så enkelt – rett og slett!

Og dette gjelder selvfølgelig ikke bare bakgrunnsbilder. Du kan vise/skjule alle slags blokker på samme måte, men det er kanskje nettopp ved bruk av bakgrunnsbilder hvor behovet for denne funksjonen er størst.

WP Basis + VIP tilbud i mai!

Kjøper du WP Basis kurset før 1. juni får du VIP medlemskap gratis den første måneden, deretter kun kr 599,- ink.mva pr mnd. Prisen låses så lenge du er aktiv medlem.

Fra 1. juni går prisen opp til kr 999,- pr mnd, men kun for nye medlemmer.

Skriv en kommentar

Din e-postadresse vil ikke bli publisert.

Dette nettstedet bruker Akismet for å redusere spam. Lær om hvordan dine kommentar-data prosesseres.

Ikke gå glipp av nyheter fra WP Skolen

Du vil motta e-post fra oss når vi har nye blogginnlegg, nyheter eller tilbud som vi tror vil være av interesse for deg. Du kan melde deg av når du vil!

Tilbakestill passord

Gjenopprett passordet ditt

En link for å gjenopprette passord vil bli sendt deg på e-post.

Tilbake