Slik angir du bildebakgrunn i WordPress

Slik angir du bildebakgrunn i WordPress
WordPress-bakgrunnsbilde for hjemmeside med andre elementer.

Det finnes flere måter å legge til bakgrunnsbilder på i WordPress. Fra de mest grunnleggende til de mest avanserte med endring av temakode. Vi er imidlertid glade for å kunne presentere et brukervennlig verktøy som er ideelt for nettstedsadministratorer uten kunnskap om koding og design. Citadela Pro-plugin kommer med mange funksjoner og innstillinger for tilpasning av nettstedet.

Prøv de kraftige blokkene, innstillingene og funksjonene i Citadela Pro-plugin-modulen. Du kan utforske det perfekte verktøyet som lar deg legge til bakgrunnsbilder på WordPress-sider, innlegg og egendefinerte innleggstyper.

Cluster er en Gutenberg-blokk i WordPress som lar deg legge til et bakgrunnsbilde. Med dette multifunksjonelle elementet kan du endre WordPress' standardbakgrunn. Du kan ikke bare legge til et bakgrunnsbilde, men også kombinere det med andre blokker. Du får mange variasjoner og allsidighet.

Kombinert med Blokk for sidetittelfår du enkelt en fantastisk nettside. Du kan legge til flere Gutenberg-blokker og tilpasse bakgrunnsbildet i WordPress. Du kan også lagre et sett med blokker som gjenbrukbare blokker og legge til et tema hvor som helst på nettstedet ditt. Så du kan endre bakgrunnen på WordPress-nettstedet med en gang.

Slik legger du til bakgrunnsbilde i WordPress ved hjelp av Gutenberg-blokken

Kom i gang nå

Engangsbetaling. 30 dagers pengene tilbake-garanti.

WordPress-bakgrunnsbilde gjennom Cluster-blokken

Vi presenterer en praktisk blokk som vi har laget for WordPress Gutenberg-blokken for bakgrunnsbilder - Cluster-blokken. Den er en del av vår egen blokkgruppe. Citadela Pro-plugin har mange funksjoner som hjelper deg med å lage flotte nettsider. Alle tilpassede blokker fra AitThemes er tilgjengelige i Citadela Pro-plugin.

Vennligst les Cluster Block-dokumentasjon for detaljerte innstillinger.

Med en klyngeblokk kan du gruppere flere blokker til én. Du kan effektivt arbeide med hele den grupperte gruppen som om det var én blokk. Klyngebredden kan settes til full sidebredde, noe som betyr at du har ekstra mye plass til å legge til ulike blokker.

Cluster vil ikke strekke seg til full bredde hvis:

  • Du har et aktivt sidefelt
  • Hvis du bruker kolonner som vil begrense plassen for Cluster

Fordi noen av WordPress-kjerneblokkene bare kan justeres i forhold til innholdsbredden, gir Cluster-blokken større variasjonsmuligheter når du bygger opp nettstedet ditt. En annen flott funksjon er at du kan angi et bakgrunnsbilde i WordPress, endre farge eller legge et bakgrunnsbilde over. Bakgrunnen kan derfor konfigureres i henhold til nettstedets design.

I denne artikkelen vil vi vise deg:

Slik legger du til klyngeblokk

Klyngeblokken er en premiumblokk og er bare tilgjengelig hvis du installerer og aktiverer den. Citadela Blocks plugin. Etter at du har installert plugin-modulen, blir Cluster-blokken automatisk lagt til i WordPress Block Editor, og du kan umiddelbart begynne å jobbe med den.

Klyngeblokken kan legges til i både innlegg og sider. Bare klikk på "+"-tegnet i topplinjen eller hvor som helst på redigeringsbordet. Deretter er det bare å søke etter Cluster-blokken.

Legg til klyngeblokk i WordPress-editoren ved å klikke på "+".
Legge til klyngeblokk ved å klikke på "+"

Det andre alternativet for å legge til klyngeblokk er å skrive "/" og blokknavnet etter det. Cluster-blokken er da klar til bruk.

Legg til klyngeblokk med skråstrek "/"
Legge til klyngeblokk ved hjelp av skråstrek "/"

Gruppering av blokker ved hjelp av Cluster

Klyngeblokkens viktigste funksjon er å gruppere flere blokker til én. La oss ta en titt på hvordan den fungerer. Hvis du setter inn Cluster-blokken på siden din, vil du umiddelbart se en plassholder "Sett inn flere blokker her". Hvis du klikker på den, får du opp en liste over alle tilgjengelige blokker. Du kan også søke etter ønsket blokk ved hjelp av søkefeltet øverst i listen.

Prosessen med å velge nestede blokker
Prosessen med å velge og sette inn nestede blokker

Alle nestede blokker har alle standardalternativer og innstillinger tilgjengelig. Hvis du for eksempel setter inn en bildeblokk, har du mulighet til å laste opp et bilde eller velge det fra mediebiblioteket.

Ved hjelp av Cluster-blokken kan du f.eks. lage en iøynefallende seksjon på nettstedet ditt for å presentere det siste arbeidet ditt. Legg til bilder fra porteføljen din og sett deretter et bakgrunnsbilde under. Nå har du laget en fin lenke til porteføljen din.

Bildeblokk nestet i klyngeblokk
Porteføljenettsted opprettet ved hjelp av Cluster-blokken

Cluster-blokken kan også brukes til å lage attraktive produktpresentasjoner. Du kan angi produktbilde som bakgrunn for seksjonen og velge farge. Serviceblokk kan også nestes inne i Cluster-blokken.

Tjenesteblokk nestet i klyngeblokk
Bruk tjenesteblokken i klyngeblokken til å presentere produktet ditt (og dets funksjoner) på en mer attraktiv måte.

Flere blokker i én enkelt blokk

Hvis du vil legge til flere nestede blokker i en klynge, kan du bruke kolonneblokken. Ved hjelp av kolonneblokken kan du legge til flere blokker side om side. Hver kolonne kan ha ulike innholdstyper, for eksempel bilder, avsnitt, lister eller knapper.

Et typisk eksempel på flere kolonner i kombinasjon med Cluster-blokk er en nettside med én side.

Kolonneblokk nestet i klyngeblokk
Hvordan kan klyngeblokken brukes på en nettside?

Grunnleggende innstillinger i verktøylinjen: Alternativer for justering av innhold

Som standard er bredden på klyngeblokken satt til innholdsstørrelsen. Du kan endre dette i verktøylinjen. Følgende alternativer er tilgjengelige:

  • Innholdsstørrelse - standardalternativ, Cluster-blokken har samme bredde som innholdet.
  • Bred størrelse - innholdet i Cluster er bredere enn innholdsbredden.
  • Full bredde - i dette tilfellet er klyngebredden fra side til side i nettleservinduet.

Det er viktig å merke seg at denne innstillingen bare påvirker klyngeinnholdet hvis det aktive temaet ditt støtter det. Alle nestede blokker kan konfigureres basert på tilgjengeligheten av alternativene.

Last ned CitadelaWP WordPress-tema og plugin-moduler

Engangsbetaling. 30 dagers pengene tilbake-garanti.

Fargeinnstillinger for overskrift og skilletegn

Endring av farge på overskrift

Siden WP 5.3 har du kunnet endre fargen på overskriften via overskriftsblokken. Dette er en svært nyttig funksjon - spesielt hvis du har en mørk layout og et mørkt fargevalg, er det bedre å endre standard tekstfarge (som er svart) til en lysere farge.

Det var ikke mulig å endre overskriftsfargen før den nye versjonen, noe som førte til problemer med synligheten på en mørk base. Derfor hendte det ofte at overskriften gikk i ett med WordPress-bakgrunnsbildet eller bildet du la til. Nå kan du velge riktig overskriftsfarge for å få nettstedet ditt til å skinne.

Ny farge for Separator som brukes på nettstedet ditt

Når du legger til et bakgrunnsbilde eller annen type innhold i WP, kan det av og til være nødvendig å skille det fra resten av nettstedet. Til dette formålet kan du bruke en spesiell blokk som kalles Separator. Ved å sette inn Separator kan du:

  • Separate spesifikke blokker
  • Dele opp hele teksten i mindre deler
  • Fremhev viktige deler
  • Sikre bedre lesbarhet av innholdet
  • Forenkle navigasjonen på nettstedet ditt

I tillegg kan du nå endre fargen på separatorlinjen med det oppdaterte WordPress. Colored Separator er perfekt for å fullføre fargevalget på nettstedet ditt.

Slik legger du til bakgrunnsbilde under grupperte blokker

Den virkelige styrken med Cluster-blokken er at du kan legge til bakgrunnsbilde og angi bakgrunnsfarge under grupperte blokker. Alt kan enkelt konfigureres i WordPress-inspektøren. La oss ta en titt på hvordan du gjør det.

  1. Klikk på Bakgrunnsbilde og aktiver funksjonen "Vis bakgrunnsbilde".
  2. Klikk på "Velg bilde". Mediebiblioteket åpnes. Du kan velge et eksisterende bilde eller laste opp et nytt bilde til biblioteket.
  3. Bakgrunnsbildet kan også settes til fast. Det betyr at hvis du blar på siden, vil bakgrunnen ikke bevege seg med innholdet, og posisjonen vil være fast.
  4. Du kan også velge hvilken del av bakgrunnsbildet som skal vises ved hjelp av "Focal Point Picker". Det er også mulig å velge en del av bildet i prosent.
Slik legger du til bakgrunnsbilde under grupperte blokker
Steg-for-steg-veiledning for hvordan du legger til et bakgrunnsbilde

Kom i gang nå

Engangsbetaling. 30 dagers pengene tilbake-garanti.

Bakgrunnsoverlegg

Et av de avanserte alternativene i Cluster er bakgrunnsbildeoverlegg. Du kan velge en av standardfargene eller en egendefinert farge ved hjelp av fargevelgeren. Det er også mulig å angi fargeopasitet. Disse Cluster-blokkinnstillingene hjelper deg med å skape en virkelig attraktiv nettsidepresentasjon.

Bakgrunnsbildeoverlegg i WordPress
Angi bakgrunnsoverlegg og endre opasitet for å skape iøynefallende design

Ny gruppeblokk tilgjengelig i kjernen

Hva er forskjellen mellom Group block og AitThemes Cluster block?

Vår skreddersydde Cluster-blokk ble lansert tidligere enn Group-blokken og gir en mer kompleks løsning. Du kan bruke Group-blokken til å gruppere flere blokker, men den har fortsatt begrensede funksjoner. Du kan for eksempel ikke angi fargeoverlegg i blokken - du kan bare velge en grunnleggende bakgrunnsfarge som skal ligge rundt bildet, ikke over det.

I Cluster-blokken vår er det enkelt å redigere bakgrunnsbilder.

Du kan laste opp til WordPress-bakgrunnsbildet ditt, angi bakgrunnsfarge for det og også bakgrunnsfargeoverlegg (og tilpasse overleggets opasitet også!). Det tar bare noen få minutter.

4 tenkte på «How to set image background in WordPress»

  1. Er det mulig å la en besøkende på nettstedet ditt ved hjelp av Cluster-blokker velge et bakgrunnsbilde og et overleggsbilde fra et utvalg av bilder?

    1. Hei, John,

      Takk for at du er interessert i Citadela-produkter. Ja, for å sette opp bakgrunn kan du velge mellom ulike alternativer. Detaljert informasjon finner du på: https://www.ait-themes.club/citadela-doc/cluster-block/

      Med vennlig hilsen!
      Zlatko
      AIT-team

Kommentarer er stengt.