Dëshironi të krijoni një footer ngjitës me DIVI që zbulohet plotësisht kur lëvizni poshtë?
Shtimi i një footer ngjitës në tuaj Site Web mund të sjellë atë pak prekje shtesë që po kërkoni në tuaj Site Web. Efekti "Reveal", i cili lejon që fundi të zbulohet kur lëvizni poshtë, do t'i japë një dizajn shumë simpatik faqeve tuaja të internetit.
Zakonisht ky efekt kërkon CSS të personalizuar që është kufizuese dhe e vështirë për t'u përdorur. Por falë DIVI, ju mund ta arrini lehtësisht atë.
Në këtë tutorial, ne do t'ju tregojmë se si të krijoni një efekt Reveal në fundin tuaj ngjitës. Gjithçka që duhen janë disa hapa të thjeshtë.
Le të fillojmë!
studim
Këtu është një përmbledhje e shkurtër e futbollit ngjitës me efektin Reveal që do të krijojmë në këtë tutorial.
Krijoni një shabllon të ri për futboll
Shihemi Divi >> Ndërtuesi i Temave nga pulti i WordPress.
Atje, klikoni mbi "Shto një footer global"
Pastaj zgjidhni "Ndërtimi i një fundi global"
Në këtë tutorial, ne do të përdorim një plan urbanistik të parapërgatitur për të përshpejtuar procesin e krijimit, por ju gjithashtu mund ta bëni atë nga e para. Për ta bërë këtë, klikoni "Ngarkimi nga Biblioteka".
Nën dritaren që shfaqet Ngarkoni nga Biblioteka, gjeni dhe përdorni paraqitjen " Marina Rreth faqes » nga paketa e paraqitjes së Marinës.
Pasi të jetë ngarkuar faqosja, fshini të gjitha seksionet përveç seksionit të fundit. Ne do të përdorim këtë seksion të fundit për të shtuar efektin Reveal.
Shto efektin Reveal dhe bëje futbollin ngjitës
Bëje fusterin të ngjitet
Shih gjithashtu: Si të krijoni një menu rrëshqitëse dhe shtytëse në DIVI?
Së pari, duhet ta bëjmë futerin ngjitës. Për ta bërë këtë, hapni cilësimet e seksionit dhe klikoni në skedën i përparuar. Nën "Efektet e lëvizjes", ndryshoni cilësimet si më poshtë:
- Pozicioni ngjitës: Rrini në fund
Përditëso indeksin Z për gjendjen ngjitëse
Më pas, ne duhet t'i japim seksionit tonë të fundit të faqes një z-indeks prej 0 kur seksioni është në gjendje ngjitëse. Kjo do të lejojë që seksioni të qëndrojë pas seksioneve ose elementëve të tjerë në trupin e faqes kur lëviz.
Për ta bërë këtë, përditësoni pozicionin e Indeksit Z duke klikuar ikonën ngjitëse pranë opsionit Z Index. Pastaj përditësoni indeksin Z në 0.
- Indeksi Z (ngjitës): 0
Përditëso indeksin Z i mbajtësit të vendndodhjes së futbollit ngjitës
Kur një elementi i caktohet një pozicion ngjitës në Divi, gjithashtu krijohet automatikisht një element mbajtës i kopjimit. Kjo siguron funksionalitetin e nevojshëm për të pozicionuar dhe dizajnuar elementë ngjitës duke përdorur Divi Builder.
Shih gjithashtu: Si të krijoni një titull global me Ndërtuesin e Temave të Divi
Në këtë rast, krijohet një vendmbajtës i seksionit të fundit me një indeks z të paracaktuar prej 1. Ne nuk duam seksionin tonë aktual ngjitës të fundit (tani me një indeks Z prej 0) pas seksionit të mbajtësit të vendeve, kështu që ne duhet të përditësojmë Indeksi Z i vendmbajtësit në -1.
Për ta bërë këtë, së pari shtoni një klasë të personalizuar CSS në seksionin e footer-it si më poshtë:
- Klasa CSS: ngjitëse-footer-reveal
Pastaj hapni cilësimet e faqes duke përdorur menynë e cilësimeve të Ndërtues i Temave.
Shkoni në " E avancuar " dhe futni CSS-në e mëposhtme në kuti Personalizo CSS :
.sticky-footer-reveal.et_pb_sticky_placeholder {
z-index:-1;
}
Kjo do të detyrojë seksionin e mbajtësit të vendndodhjes të qëndrojë pas fusterit ngjitës.
ruaj Ndryshimet
Pasi të keni mbaruar, ruani ndryshimet e bëra në shabllonin e fundit.
Ruani gjithashtu ndryshimet e Divi Theme Builder.
Rezultati përfundimtar
Për të parë rezultatin përfundimtar, shikoni një faqe dhe lëvizni.
Shkarkoni DIVI tani!!!
Përfundim
Në Divi, duke shtuar një fund të faqes ngjitëse në tuaj Site Web nuk kërkon një shtojcë ose CSS të komplikuar me porosi. Duke përdorur konstruktorin themes, mund të krijoni lehtësisht një shabllon të fundit me Efekti i zbulimit brenda pak minutash.
Shpresojmë që kjo do t'i japë dizajnit tuaj të fundit të faqes një nxitje delikate me një ndërveprim tërheqës që vizitorët do të vlerësojë. Nëse keni ndonjë shqetësim apo sugjerim, na gjeni në pjesa e komenteve për ta diskutuar atë.
Shih gjithashtu burimet tona, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress ose atë më Divi: tema më e mirë e WordPress të të gjitha kohërave.
Por në ndërkohë, ndajeni këtë artikull në rrjetet tuaja të ndryshme sociale.
...
