Vil du lage unike bakgrunnsbilder ved å bruke mønsterblandingsmodusen til Divi ?
De innebygde bakgrunnsmønsterinnstillingene til Divi lar deg lage iøynefallende design og legge til stil til bakgrunnsbildene til din nettstedet Web. Du kan bruke innstillinger for blandingsmodus for å finjustere hvordan mønsteret blander seg med bakgrunnsbildet.
I denne opplæringen skal vi vise deg noen eksempler på hvordan du legger til en mønsterblandingsmodus til bakgrunnsbildene på siden din. Følg dem for å gjenskape disse lookene på egen hånd, eller bruk dem som inspirasjon til å lage dine egne tilpassede design.
La oss begynne!
undersøkelsen
Her er en forhåndsvisning av hva vi skal utforme i denne opplæringen.
Første layout
Andre layout
Tredje layout
Slik bruker du mønsterblandingsmoduser på Divi-bakgrunnsbildene dine
Opprett en ny side med et forhåndsdefinert oppsett
Vi starter med å bruke en forhåndsdefinert layout fra biblioteket Divi. For dette designet vil vi bruke «Marina landingsside 'Av Marina Layout Pack .
Legg til en ny side til din nettstedet Web og gi den en tittel, og velg deretter alternativet Bruk Divi Builder.
Vi vil bruke en forhåndsdefinert layout fra Divi-biblioteket for dette eksemplet, så velg Bla gjennom layouter.
Finn og velg oppsettet Marina landingsside.
Velg Bruk denne layouten for å legge til oppsettet på siden din.
Vi er nå klare til å designe.
Første layout
For vår første design legger vi til et chevronmønster til det første overskriftsbildet. Dette vil legge litt visuell interesse til overskriften.
Les også: Divi: Hvordan tilpasse "Countdown Timer"-modulen med en GIF
På grunn av blandingsmodusen vi vil bruke, vil mønsteret være mer subtilt og fortsatt la bakgrunnsbildet være synlig.
Først åpner du seksjonsinnstillingene og går til seksjonen Bakgrunn. Klikk på fanen Bakgrunnsmønster og velg Legg til bakgrunnsmønster.
Deretter velger du mønstertypen. Som du kan se, er det mange forskjellige maler å velge mellom, og de kan alle tilpasses ytterligere ved hjelp av malinnstillingene nedenfor.
- Mønstertype: Omvendt fiskebein 2
Lagt til "Pattern Blend"-modus
Til slutt, still inn blandingsmodus for mønsteret. Vi vil bruke blandingsmodus Mykt lys for dette eksemplet. Denne blandingsmodusen gjør mønsteret mer subtilt slik at det ikke distraherer fra bakgrunnsbildet.
- Mønsterblandingsmodus: Mykt lys
Resultat
Her er den endelige utformingen av vårt første eksempel.
Her er mobilversjonen.
Andre layout
For den andre layouten bruker vi et bølgemønster som er lagt over bakgrunnsbildet og gradienten, som passer godt med sidens nautiske tema.
Naviger først til delen "Hvordan det fungerer" og åpne seksjonsinnstillingene.
Åpne innstillinger Bakgrunn, og velg deretter fanen Bakgrunnsmønsterog klikk Legg til bakgrunnsmønster.
For dette designet vil vi bruke mønstertype Bølger.
- Mønstertype: Bølger
Endre deretter mønsterfargen til hvit.
- Mønsterfarge: #FFFFFF
Lagt til mønsterblandingsmodus
Vi kan nå legge til blandingsmodus til mønsteret vårt. Sett mønsterblandingsmodus til overlay.
Oppdag også: Divi: Hvordan tilpasse kurven og søkeikonene til modulen "Fullbreddsmeny".
Denne blandingsmodusen gjør mørke farger i bakgrunnsbildet mørkere og lysere lyse farger.
- Mønsterblandingsmodus: Overlegg
Resultat
Her er det endelige resultatet av det andre eksemplet brukt på seksjonen "Hvordan det fungerer".
Og her er mobilversjonen.
Tredje layout
La oss starte vår tredje layout.
For denne layouten legger vi til ugjennomsiktige diagonale striper i bakgrunnen til " Call to Action".
Start med å åpne seksjonsinnstillingene og gå til seksjonen Bakgrunn. Klikk på fanen Bakgrunnsmønster, og velg deretter Legg til bakgrunnsmønster.
Velg mønster Diagonale striper.
Deretter setter du mønsterfargen.
- Mønsterfarge: rgba(255,255,255,0.25)
Vend mønsteret horisontalt ved å bruke Transform Pattern-innstillingene. Dette er en annen parameter som kan hjelpe deg med å finjustere mønsteret til din smak.
- Mønstertransformasjon: horisontal
Lagt til mønsterblandingsmodus
Til slutt, still inn blandingsmodus for mønsteret. For dette designet vil vi bruke blandingsmodus lysstyrken.
Les også vår guide om: Divi: Hvordan bruke "Gradient Builder" for å forskjønne bildene dine
Dette, kombinert med mønsterfargen vår, legger til en lyssterk skjerm til bildet samtidig som bildet kan vises gjennom. Med dette designet skiller bildet av båten seg mer ut fra bakgrunnen ettersom mønsteret tilfører en særegen kontrast.
- Mønsterblandingsmodus: Lysstyrke
Resultat
Her er det endelige designet for denne delen.
Og her er mobilversjonen.
Endelig resultat
La oss nå ta en titt på helsidedesignet med mønsterblandingsmoduser.
Last ned DIVI nå!!!
konklusjonen
Å legge til et mønster kan være en fin måte å legge til visuell interesse for bakgrunnsbildet ditt, men noen ganger kan mønsteret overvelde bakgrunnsbildet. Heldigvis kommer Divi med mange blandingsmoduser slik at du kan tilpasse mønstrene så mye du vil.
Vi håper denne veiledningen vil inspirere deg til dine neste Divi-prosjekter. Hvis du har noen bekymringer eller forslag, finn oss inn kommentarfeltet å diskutere det.
Du kan også konsultere ressursene våre, hvis du trenger flere elementer for å gjennomføre prosjektene dine med oppretting av nettsteder.
Ikke nøl med å også konsultere vår guide på WordPress blog oppretting eller den på Divi: tidenes beste WordPress-tema.
Men i mellomtiden, del denne artikkelen på de forskjellige sosiale nettverkene dine.
...