Doriți să creați un fundal unic și uimitor cu măști și modele de fundal din Divi ?
Noile măști de fundal și modele caracteristică Divi este cel mai frecvent utilizat pentru secțiunile unei pagini. Dar le putem adăuga și la anteturi!
În acest tutorial, vă vom arăta cum să adăugați măști și modele de fundal la un șablon de antet Divi folosind constructorul tematică.
Este o modalitate excelentă de a crea modele de antet complet unice pentru dvs site-ul web.
Să începem.
studiu
Iată o privire rapidă asupra designului pe care îl vom crea în acest tutorial.
Accesați generatorul de teme Divi și începeți să creați un antet global
Din tabloul de bord WordPress, accesați Divi > Theme Builder
Faceți clic pe „Adăugați antet global”
selecta „Construiți antet global”.
După aceea, puteți începe să proiectați un nou antet folosind Divi Builder.
Cum să adăugați măști și modele de fundal la un antet Divi
Crearea fundalului secțiunii cu o culoare și un model de fundal
Citiți și: Divi: Cum să creați o secțiune de Mărturii sub forma unei grile
Pentru a începe, deschideți setările secțiunii existente.
Sub filă Conţinut, actualizați opțiunile de fundal cu următoarele setări:
Culoare de fundal:
- Fundal: #262d3f
Model de fundal:
- Model: Pastile
- Culoare model: rgba(255,255,255,0.1)
- Dimensiune model: dimensiune personalizată.
- Lățimea modelului: 1px
umplutură
Sub filă Amenajări, actualizați umplutura secțiunii după cum urmează:
- Umplutură (sus și jos): 0px
Acest lucru va reduce puțin spațiul vertical al antetului.
Adăugați un rând cu următorul aspect al coloanei
S-a adăugat conținutul antetului substituentului (un meniu și un buton)
În coloana din stânga a rândului, adăugați un nou meniu.
Selectați un meniu.
Apoi adăugați o siglă și utilizați setările pentru a personaliza meniul și logo-ul după cum doriți.
În coloana din dreapta, adăugați un modul de buton și, de asemenea, personalizați-l după bunul plac.
Crearea fundalului liniei cu gradient, mască și model
Gradientul
Deschideți setările de rând care conțin meniul și butonul. Apoi actualizați opțiunile de fundal cu următoarele setări de fundal:
Gradient de fundal:
- Opriri de gradient 1 (50%): clar
- Gradient Stops 2 (75%): #ff4c00
- Direcție: 90 de grade
Model
- Model: Pastile
- Culoare model: rgba(38,45,63,0.48)
- Dimensiune model: 1 pixel
- Offset vertical: 20px
Notă: offset-ul vertical al modelului este setat la 20px, deoarece există o umplutură superioară de 20px în secțiunea de deasupra liniei. Acest lucru asigură că modelul secțiunii se aliniază cu modelul rândului.
Mască de fundal
- Mască: Herringbone
- Culoarea măștii: #262d3f
NOTĂ: Pentru anteturi, cel mai bine este să păstrați dimensiunea măștii setată la „Extend to Fill”, astfel încât să acopere spațiul orizontal fără a compromite designul măștii.
Ultimele retușuri la linie
Vezi si: Divi: Cum să utilizați „Gradient Builder” pentru a vă înfrumuseța imaginile
Pentru a finaliza designul, vom adăuga o rază de chenar și alte câteva modificări la linie.
Raza, chenarul și distanța dintre margini
Sub filă Amenajări, actualizați umplutura după cum urmează:
- Umplutură (sus și jos): 5px
Apoi dați rândului un colț rotunjit frumos pentru un element de design suplimentar.
- Colțuri rotunjite: 50px
- Lățimea chenarului din stânga: 50px
- Culoarea marginii din stânga: #262d3f
Trebuie să dăm un chenar în partea stângă a rândului, deoarece marginea pătrată a măștii va depăși rândul în ciuda colțurilor rotunjite.
Rezultat final
Să vedem rezultatul final.
Gradientul este puțin subtil, așa că iată o privire la cum arată.
Și aici este designul antetului desktop și mobil.
Descărcați DIVI acum!!!
Concluzie
Designul de fundal al antetului este doar vârful aisbergului. Există o mulțime de explorare cu opțiunile de fundal disponibile în Divi.
Sperăm că acest tutorial v-a ajutat să înțelegeți cum măștile și modelele de fundal ale Divi pot lucra împreună pentru a crea un design unic de fundal pentru anteturile dvs.
Simțiți-vă liber să experimentați cu mai multe combinații de design de fundal pentru a se potrivi propriului design. site-ul web sau viitorul tău proiect.
De asemenea, puteți consulta resursele noastre, dacă aveți nevoie de mai multe elemente pentru a vă derula proiectele de creare a site-urilor de internet.
Nu ezitați să consultați și ghidul nostru despre Creare blog WordPress sau cea de pe Divi: cea mai bună temă WordPress din toate timpurile.
Dar între timp, împărtășește acest articol pe diferitele rețele de socializare.
...
