Želite li stvoriti jedinstvene pozadinske slike pomoću načina miješanja uzoraka Divi ?

Ugrađene postavke uzorka pozadine Divi omogućuju vam da stvorite privlačan dizajn i dodate stil pozadinskim slikama vašeg web stranica. Postavke načina stapanja možete koristiti za fino podešavanje načina na koji se uzorak stapa s pozadinskom slikom. 

U ovom vodiču ćemo vam pokazati neke primjere o tome kako dodati način miješanja uzoraka na pozadinske slike vaše stranice. Slijedite ih kako biste sami rekreirali ove izglede ili ih upotrijebite kao inspiraciju za stvaranje vlastitih prilagođenih dizajna.

Krenimo!

pregled

Evo pregleda onoga što ćemo dizajnirati u ovom vodiču.

Prvi raspored

Divi način miješanja uzoraka

Drugi raspored

Divi način miješanja uzoraka

Treći raspored

Divi način miješanja uzoraka

Kako koristiti načine miješanja uzoraka na vašim Divi pozadinskim slikama

Napravite novu stranicu s unaprijed definiranim izgledom

Počet ćemo korištenjem unaprijed definiranog izgleda iz biblioteke Divi. Za ovaj dizajn koristit ćemo « Marina Landing Page »Od Marina Layout Pack .

Dodajte novu stranicu svojoj web stranica i dodijelite mu naslov, zatim odaberite opciju Use Divi Builder.

Za ovaj ćemo primjer koristiti unaprijed napravljeni izgled iz Divi knjižnice, pa odaberite Pregledaj rasporede.

Način miješanja Divi pozadinskog uzorka Pregledajte rasporede

Pronađite i odaberite izgled Marina Landing Page.

Divi Background Pattern Blending Mode Search Layout

odabrati Koristite ovaj izgled da biste dodali izgled svojoj stranici.

Način miješanja Divi pozadinskog uzorka Koristite raspored

Sada smo spremni za dizajn.

Prvi raspored

Za naš prvi dizajn, dodat ćemo uzorak ševrona prvoj slici zaglavlja. Ovo će zaglavlju dodati nešto vizualnog interesa. 

Pročitajte također: Divi: Kako prilagoditi modul "Countdown Timer" s GIF-om

Zbog načina miješanja koji ćemo primijeniti, uzorak će biti suptilniji i još uvijek će omogućiti da pozadinska slika bude vidljiva.

Prvo otvorite postavke odjeljka i idite na odjeljak pozadina. Pritisnite karticu Pozadinski uzorak i odaberite Dodaj pozadinski uzorak.

Divi 1 Pozadinski uzorak Raspored načina miješanja Dodajte pozadinski uzorak

Zatim odaberite vrstu uzorka. Kao što vidite, postoji mnogo različitih predložaka koje možete izabrati, a svi se mogu dodatno prilagoditi postavkama predloška u nastavku.

  • Vrsta uzorka: preokrenuta riblja kost 2

Dodan je način rada "Stavljanje uzorka".

Na kraju postavite način miješanja uzorka. Koristit ćemo način miješanja Meko svjetlo za ovaj primjer. Ovaj način miješanja čini uzorak suptilnijim tako da ne skreće pozornost s pozadinske slike.

  • Način miješanja uzorka: meko svjetlo
Divi način miješanja pozadinskog uzorka Način miješanja uzorka Izgled 1

rezultat

Ovdje je konačni dizajn našeg prvog primjera.

Divi 1 Konačni dizajn načina miješanja pozadinskog uzorka

Ovdje je mobilna verzija.

Divi 1 Pozadinski uzorak Način miješanja Layout Final Design Mobile

Drugi raspored

Za drugi izgled koristit ćemo valoviti uzorak prekriven pozadinskom slikom i gradijentom, što se dobro slaže s pomorskom temom stranice.

Prvo idite na odjeljak "Kako radi" i otvorite postavke odjeljka. 

Otvorite postavke pozadina, a zatim odaberite karticu Pozadinski uzoraki kliknite Dodaj pozadinski uzorak.

Divi 2 Pozadinski uzorak Raspored načina miješanja Dodajte pozadinski uzorak

Za ovaj dizajn koristit ćemo vrstu uzorka Valovi.

  • Vrsta uzorka: valovi
Divi 2 Pozadinski uzorak Izgled načina miješanja Odaberite uzorak

Zatim promijenite boju uzorka u bijelu.

  • Boja uzorka: #FFFFFF
Divi Background Pattern Način miješanja Layout 2 Pattern Boja

Dodan način miješanja uzoraka

Sada možemo dodati način miješanja našem uzorku. Postavite način miješanja uzoraka na Prekriti

Otkrijte također: Divi: Kako prilagoditi košaricu i ikone pretraživanja modula "Fullwidth Menu"

Ovaj način miješanja potamnjuje tamne boje na pozadinskoj slici i posvjetljuje svijetle boje.

  • Način miješanja uzorka: Prekrivanje
Divi 2 Pozadinski uzorak Raspored načina miješanja Odaberite način miješanja

rezultat

Ovdje je konačni rezultat drugog primjera primijenjenog na odjeljak "Kako radi".

Divi 2 Konačni dizajn načina miješanja pozadinskog uzorka

A evo i mobilne verzije.

Divi Background Pattern Blending Mode 2 Layout Final Design Mobile

Treći raspored

Započnimo naš treći raspored. 

Za ovaj izgled dodat ćemo neprozirne dijagonalne pruge na pozadinu " Poziv na akciju".

Započnite otvaranjem postavki odjeljka i idite na odjeljak pozadina. Pritisnite karticu Pozadinski uzorak, zatim odaberite Dodajte pozadinski uzorak.

Divi 3 Pozadinski uzorak Raspored načina miješanja Dodajte pozadinski uzorak

Odaberite uzorak Dijagonalne pruge.

Divi 3 Pozadinski uzorak Izgled načina miješanja Odaberite uzorak

Zatim postavite boju uzorka.

  • Boja uzorka: rgba(255,255,255,0.25)
Divi Background Pattern Način miješanja Layout 3 Pattern Boja

Okrenite uzorak vodoravno koristeći postavke Transform Pattern. Ovo je još jedan parametar koji vam može pomoći u finom podešavanju uzorka prema vašim željama.

  • Transformacija uzorka: vodoravno
Divi 3 Pozadinski uzorak Način miješanja Raspored Transformacija uzorka

Dodan način miješanja uzoraka

Na kraju postavite način miješanja uzorka. Za ovaj dizajn koristit ćemo način miješanja sjaj

Pročitajte i naš vodič na: Divi: Kako koristiti "Gradient Builder" za uljepšavanje vaših slika

Ovo, u kombinaciji s našom bojom uzorka, dodaje sliku svjetliji zaslon dok omogućuje vidljivost fotografije. Uz ovaj dizajn, slika broda se više ističe od pozadine jer uzorak dodaje prepoznatljiv kontrast.

  • Način miješanja uzorka: Luminosity
Divi 3 pozadinski uzorak raspored načina miješanja Način miješanja

rezultat

Ovdje je konačni dizajn za ovaj odjeljak.

Divi 3 Konačni dizajn načina miješanja pozadinskog uzorka

A evo i njegove mobilne verzije.

Divi način miješanja uzoraka

Konačni rezultat

Sada pogledajmo cijeli dizajn stranice s načinima stapanja uzoraka.

Divi način miješanja uzoraka

Preuzmite DIVI odmah!!!

Zaključak

Dodavanje uzorka može biti sjajan način za dodavanje vizualnog interesa vašoj pozadinskoj slici, ali ponekad uzorak može nadjačati pozadinsku sliku. Srećom, Divi dolazi s mnoštvom načina miješanja tako da možete prilagoditi uzorke koliko god želite. 

Nadamo se da će vas ovaj vodič inspirirati za vaše sljedeće Divi projekte. Ako imate nedoumica ili prijedloga, potražite nas odjeljak komentara raspravljati o tome.

Također se možete konzultirati naši resursi, ako vam je potrebno više elemenata za provođenje projekata kreiranja internetskih stranica.

Ne ustručavajte se također konzultirati naš vodič o Izrada bloga WordPress ili onaj koji je uključen Divi: najbolja WordPress tema svih vremena.

Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama.

...