Punozaslonski modul Izbornik na Divi olakšava dodavanje lijepih obojenih zaglavlja na vrh stranica (ili bilo gdje na web mjestu, ako želite). Ovi se moduli mogu smjestiti samo u odjeljke pune širine.
Kako dodati modul Divi preko cijelog zaslona
Prije nego što svojoj stranici možete dodati modul izbornika preko cijelog zaslona, prvo morate uskočiti u Divi Builder. Jednom Divi tema instaliran na vašem web stranica, primijetit ćete gumb Koristite Divi Builder iznad uređivača postova kad god izradite novu stranicu. Pritisnite ovaj gumb da biste aktivirali Divi Builder i pristupili svim modulima Divi Builder. Zatim kliknite na gumb Koristite Visual Builder za pokretanje generatora u vizualnom načinu. Također možete kliknuti gumb Omogućite Visual Builder kada pregledavate svoje web stranica u prvom planu ako ste prijavljeni na nadzornu ploču WordPressa.
Nakon što uđete u Visual Builder, možete kliknuti sivi gumb plus da biste na svoju stranicu dodali novi modul. Novi moduli izbornika preko cijelog zaslona mogu se dodati samo unutar odjeljaka s punom širinom. Ako započinjete novu stranicu, ne zaboravite prvo dodati odjeljak s punom širinom na svoju stranicu.
Pronađite modul zaglavlja preko cijelog zaslona na popisu modula i kliknite ga da biste ga dodali na svoju stranicu. Popis modula je pretraživ, što znači da možete upisati i riječ "zaglavlje cijelog zaslona", a zatim kliknuti "Enter" da biste automatski pronašli i dodali modul zaglavlja cijelog zaslona! Nakon dodavanja modula, dočekat će vas popis opcija modula. Te su opcije podijeljene u tri glavne skupine: Sadržaj , Začeće et napredan .
Primjer upotrebe: Dodavanje zaglavlja preko cijelog zaslona na stranicu O stranici
U ovom primjeru pokazat ću vam kako pomoću modula zaglavlja Fullwidth dodati zaglavlje s prilagođenim tekstom i pozadinskom slikom.
Svi moduli preko cijelog zaslona dostupni su samo kada se koriste cjeloviti odjeljci. Pomoću Visual Builder-a umetnite novi odjeljak preko cijelog zaslona. Zatim dodajte modul Person u odjeljak.
Ažurirajte postavke zaglavlja na cijelom zaslonu kako slijedi:
Opcije sadržaja
Naslov: O nama Tekst podnaslova: Razlikujemo stvari ... URL pozadinske slike: [umetanje slike 1920 x 800] Prekrivna pozadina Boja: rgba (0,0,0,0.2 , XNUMX)
Mogućnosti dizajna
Orijentacija teksta i logotipa: Srednji gumb Gumb za pomicanje prema dolje: DA Ikona: [ikona za odabir] Ikona za pomicanje prema dolje Boja: # fcbf00 Ikona pomicanja: 50px Boja teksta: Boja svijetlog teksta: # fcbf00 Font Naslov: Otvoreno bez, podebljano, velika slova Veličina fonta naslova: 60px (radna površina), 40px (tablet), 30px (telefon) Veličina fonta titla: 25px
Napredne opcije (prilagođeni CSS)
Glavni element:
presvlake: 100px 0;
To je sve!
Opcije sadržaja zaglavlja na cijelom zaslonu
Na kartici Sadržaj pronaći ćete sve elemente sadržaja modula, kao što su tekst, slike i ikone. Sve to kontrolira što se pojavljuje u vašem modulu uvijek će se naći na ovoj kartici.
Naslov
Ovdje unesite naslov svoje stranice.
Tekst podnaslova
Ako želite koristiti podnaslov, dodajte ga ovdje. Natpis će se pojaviti ispod vašeg naslova malim fontom.
Gumb # 1 tekst
Unesite tekst gumba.
Gumb # 2 tekst
Unesite tekst gumba.
Sadržaj
Ovdje možete definirati sadržaj koji će biti smješten ispod zaglavlja i teksta naslova.
URL gumba 1
Unesite URL gumba.
URL gumba 2
Unesite URL gumba.
URL slike logotipa
Prenesite željenu sliku ili unesite URL slike koju želite pregledati.
URL slike zaglavlja
Prenesite željenu sliku ili unesite URL slike koju želite pregledati.
URL pozadinske slike
Ako se postavi, ova će se slika koristiti kao pozadina ovog modula. Da biste uklonili pozadinsku sliku, samo uklonite URL iz polja postavki. Pozadinske slike pojavit će se na vrhu pozadinskih boja, što znači da boja pozadine neće biti vidljiva kada se primijeni pozadinska slika.
Boja pozadine
Definirajte prilagođenu boju pozadine za svoj modul ili ostavite prazno da biste koristili zadanu boju.
Boja presvlake u pozadini
Odaberite boju pozadinskog sloja koja će biti postavljena iznad pozadinske slike. Poluprozirne prekrivene slike mogu stvoriti neke sjajne efekte kada se postave na pozadinu slika.
Oznaka uprave
Ovo će promijeniti oznaku modula u konstruktoru radi lakše identifikacije. Kada koristite prikaz WireFrame u Visual Builderu, ove se oznake pojavljuju u modulnom bloku sučelja Divi Builder.
Opcije dizajna zaglavlja pune širine
Na kartici Dizajn pronaći ćete sve mogućnosti oblikovanja modula, poput fontova, boja, veličine i razmaka. Ovo je kartica koju ćete koristiti za promjenu izgleda vašeg modula. Svaki Divi modul ima dugački popis postavki dizajna pomoću kojih možete bilo što promijeniti.
Orijentacija teksta i logotipa
Ovo kontrolira kako je vaš tekst poravnat u modulu.
Napravite cijeli zaslon
Ovdje možete odabrati hoće li se zaglavlje proširiti na cijelu veličinu zaslona.
Koristite Parallax efekt
Ako je omogućeno, vaše će pozadinske slike imati fiksni položaj poput vašeg pomicanja, stvarajući zabavan efekt paralakse.
Parallax metoda
Definirajte metodu koja se koristi za efekt paralaksa.
Prikaži gumb za pomicanje prema dolje
Ovdje možete odabrati hoće li se prikazati gumb za pomicanje prema dolje.
ikona
Odaberite ikonu za prikaz gumba za pomicanje prema dolje.
Pomičite se prema ikoni u boji
Prema zadanim postavkama, padajuća ikona nasljeđuje boju teksta zaglavlja (bijela ili siva). Ovu boju možete promijeniti podešavanjem boje u ovoj opciji pomoću alata za odabir boja.
Pomaknite se prema dolje veličine ikone
Ovu postavku koristite za povećanje ili smanjenje veličine ikone za pomicanje prema dolje koja se pojavljuje na dnu zaglavlja.
Okomito poravnanje slike
Ovo kontrolira orijentaciju slike u modulu.
Boja teksta
Ovdje možete odabrati vrijednost svog teksta. Ako radite na tamnoj pozadini, vaš bi tekst trebao biti uključen. Ako radite sa svijetlom pozadinom, tekst bi trebao biti taman.
Okomito poravnanje teksta
Ova postavka određuje okomito poravnanje vašeg sadržaja. Sadržaj se može centrirati okomito ili poravnati na dnu.
Font naslova
Možete promijeniti font naslova odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima izvrsnih fontova koje pokreće Google Fonts. Prema zadanim postavkama Divi koristi font Open Sans za sav tekst na vašoj stranici. Također možete prilagoditi stil teksta koristeći podebljano, kurziv, velika slova i opcije podcrtavanja.
Veličina slova naslova
Ovdje možete prilagoditi veličinu teksta naslova. Možete povući klizač raspona da biste povećali ili smanjili veličinu teksta ili izravno unijeli vrijednost željene veličine teksta u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em".
Boja teksta naslova
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta u naslovu, odaberite željenu boju iz alata za odabir boja pomoću ove opcije.
Razmak naslovnih slova
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova u tekstu naslova, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos s desne strane klizača. Polja za unos podržavaju različite mjerne jedinice, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Visina naslovnice
Visina retka utječe na razmak između svakog retka teksta vašeg naslova. Ako želite povećati razmak između svakog retka, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos smješteno desno od kursora. Polja za unos podržavaju različite mjerne jedinice, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Font sadržaja
Font teksta sadržaja možete promijeniti odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima izvrsnih fontova koje pokreće Google Fonts. Prema zadanim postavkama Divi koristi font Open Sans za sav tekst na vašoj stranici. Također možete prilagoditi stil teksta koristeći podebljano, kurziv, velika slova i opcije podcrtavanja.
Veličina slova sadržaja
Ovdje možete prilagoditi veličinu teksta sadržaja. Možete povući klizač raspona da biste povećali ili smanjili veličinu teksta ili izravno unijeli željenu vrijednost veličine teksta u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Boja teksta sadržaja
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta sadržaja, odaberite željenu boju iz alata za odabir boja pomoću ove opcije.
Razmaknica slova sadržaja
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova u tekstu vašeg sadržaja, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Visina retka sadržaja
Visina retka utječe na razmak između svakog retka teksta vašeg sadržaja Ako želite povećati razmak između svakog retka, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos smješteno desno od kursora. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Font slova
Font teksta opisa možete promijeniti odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima izvrsnih fontova koje pokreće Google Fonts. Prema zadanim postavkama Divi koristi font Open Sans za sav tekst na vašoj stranici. Također možete prilagoditi stil teksta koristeći podebljano, kurziv, velika slova i opcije podcrtavanja.
Veličina slova podnaslova
Ovdje možete prilagoditi veličinu teksta opisa. Možete povući klizač raspona da biste povećali ili smanjili veličinu teksta ili izravno unijeli željenu vrijednost veličine teksta u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Boja teksta podnaslova
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta natpisa, odaberite željenu boju iz alata za odabir boja pomoću ove opcije.
Razmak slova titlova
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova u tekstu vašeg naslova, upotrijebite klizač raspona da prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Visina linije titlova
Visina retka utječe na razmak između svakog retka teksta vašeg opisa. Ako želite povećati razmak između svakog retka, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Maksimalna širina teksta
Pomoću ove postavke smanjite maksimalnu širinu teksta u zaglavnom modulu. Na primjer, vrijednost od 50% osigurat će da tekst nikada ne prelazi 50% širine ukupnog modula zaglavlja.
Upotrijebite prilagođene stilove za gumb
Omogućavanjem ove opcije otkrivaju se razne postavke prilagodbe gumba pomoću kojih možete promijeniti izgled gumba vašeg modula.
Veličina teksta gumba
Ova se postavka može koristiti za povećanje ili smanjenje veličine teksta na gumbu. Gumb se prilagođava kako se veličina teksta povećava i smanjuje.
Boja teksta gumba
Prema zadanim postavkama, gumbi usvajaju boju naglaska vaše teme kako je definirano u programu za prilagođavanje tema. Ova vam opcija omogućuje da gumbu ovog modula dodijelite prilagođenu boju teksta. Odaberite prilagođenu boju pomoću alata za odabir boje da biste promijenili boju gumba.
Boja pozadine gumba
Prema zadanim postavkama, gumbi imaju prozirnu boju pozadine. To se može promijeniti odabirom željene boje pozadine iz alata za odabir boja.
Gumb Širina granice
Svi Divi gumbi prema zadanim postavkama imaju obrub od 2 piksela. Ova se granica može povećati ili smanjiti pomoću ove postavke. Granice se mogu ukloniti unosom vrijednosti 0.
Boja rubova gumba
Prema zadanim postavkama obrubi gumba usvajaju boju naglaska vaše teme kako je definirano u programu za prilagođavanje tema. Ova vam opcija omogućuje da gumbu ovog modula dodijelite prilagođenu boju obruba. Odaberite prilagođenu boju pomoću alata za odabir boja da biste promijenili boju obruba gumba.
Radijus graničnika gumba
Polumjer obruba utječe na zaobljenost kutova gumba. Prema zadanim postavkama, gumbi u Diviu imaju mali radijus obruba koji zaokružuje uglove za 3 piksela. Ovu vrijednost možete smanjiti na 0 da biste stvorili kvadratni gumb ili ga znatno povećali da biste stvorili gumbe s kružnim rubovima.
Razmaknica slova gumba
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova u tekstu gumba, pomoću klizača raspona prilagodite razmak ili unesite željenu veličinu razmaka u polje za unos s desne strane klizača. Polja za unos podržavaju različite jedinice mjere, što znači da za promjenu vrste jedinice možete unijeti "px" ili "em", ovisno o vrijednosti vaše veličine.
Tipka gumba
Font teksta gumba možete promijeniti odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima izvrsnih fontova koje pokreće Google Fonts. Prema zadanim postavkama Divi koristi font Open Sans za sav tekst na vašoj stranici. Također možete prilagoditi stil teksta koristeći podebljano, kurziv, velika slova i opcije podcrtavanja.
Dodajte ikonu gumba
Onemogućeno, ova postavka uklonit će ikone s vašeg gumba. Prema zadanim postavkama, svi Divi gumbi prikazuju ikonu strelice na lebdenju.
Ikona gumba
Ako su ikone omogućene, pomoću ove postavke možete odabrati ikonu koju ćete koristiti na svojem gumbu. Divi ima različite ikone na izbor.
Gumb ikone u boji
Prilagodba ove postavke promijenit će boju ikone koja se pojavljuje na vašem gumbu. Prema zadanim postavkama boja ikone jednaka je boji teksta gumba, ali ova postavka omogućuje vam neovisno podešavanje boje.
Gumb za postavljanje ikona
Možete odabrati prikaz ikone gumba s lijeve ili desne strane gumba.
Pokažite ikonu samo kad zadržite pokazivač iznad gumba
Prema zadanim postavkama ikone gumba prikazuju se samo kada lebdite. Ako želite da se ikona uvijek prikazuje, isključite ovu postavku.
Boja teksta na gumbu
Kad mišem zadržite pokazivač iznad gumba, koristit će se ova boja. Boja će se promijeniti od osnovne boje definirane u prethodnim postavkama.
Boja pozadine gumba za lebdenje (boja gumba za pokazivanje)
Kad mišem zadržite pokazivač iznad gumba, koristit će se ova boja. Boja će se promijeniti od osnovne boje definirane u prethodnim postavkama.
Gumb za preusmjeravanje rubova boja (boja graničnika uz zadržavanje)
Kad mišem zadržite pokazivač iznad gumba, koristit će se ova boja. Boja će se promijeniti od osnovne boje definirane u prethodnim postavkama.
Gumb za zaobljenje graničnog polumjera
Kad se mišem zadrži pokazivač iznad gumba, koristit će se ova vrijednost. Vrijednost će se promijeniti od osnovne vrijednosti definirane u prethodnim postavkama.
Tipka razmaka razmaka
Kad se mišem zadrži pokazivač iznad gumba, koristit će se ova vrijednost. Vrijednost će se promijeniti od osnovne vrijednosti definirane u prethodnim postavkama.
Napredne opcije zaglavlja pune širine
Na naprednoj kartici pronaći ćete opcije koje bi iskusnijim web dizajnerima mogle biti korisne, poput prilagođenih CSS i HTML atributa. Ovdje možete primijeniti prilagođeni CSS na bilo koji od mnogih elemenata modula. Na modul također možete primijeniti prilagođene CSS klase i ID-ove koji se mogu koristiti za prilagodbu modula u datoteci style.css vaše dječje teme.
CSS ID
Unesite neobavezni CSS ID koji ćete koristiti za ovaj modul. ID se može koristiti za stvaranje prilagođenog CSS stila ili za povezivanje na određene odjeljke vaše stranice.
CSS klasa
Unesite izborne CSS klase koje ćete koristiti za ovaj modul. CSS klasa može se koristiti za stvaranje prilagođenog CSS stila. Možete dodati više klasa, odvojenih razmakom. Ove se klase mogu koristiti u vašoj podređenoj Divi temi ili u prilagođenoj CSS tablici stilova koju dodate na svoju stranicu ili web mjesto. web stranica pomoću opcija Divi teme ili postavki stranice Divi Builder.
Prilagođeni CSS
Prilagođeni CSS također se može primijeniti na modul i bilo koji od unutarnjih dijelova modula. U odjeljku Prilagođeni CSS pronaći ćete tekstualno polje u koje možete dodati prilagođene CSS stilske tablice izravno u svaki element. CSS unosi u ovim postavkama već su omotani stilskim oznakama. Dakle, samo unesite CSS pravila odvojena zarezom.
vidljivost
Ova vam opcija omogućuje upravljanje uređajima na kojima se pojavljuje vaš modul. Možete odabrati da deaktivirate svoj modul na tabletima, pametnim telefonima ili stolnim računalima pojedinačno. To je korisno ako želite koristiti različite modove na različitim uređajima ili ako želite pojednostaviti dizajn mobilnih uređaja uklanjanjem određenih elemenata sa stranice.
[vc_row center_row=”yes”][vc_column width=”1/2″][vcex_button target=”blank” layout=”expanded” align=”center” font_family=”Raleway” font_weight=”700″ style=”flat” custom_background=”#18b69d” custom_hover_background=”#118d7a” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]PREUZMI DIVI TEMU [/vcex_button][/vc_column][vc_column width=” 1 /2″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials” target=”blank” layout=”expanded” align=”center” font_family = ”Raleway” font_weight=”700″ style=”flat” custom_background=”#c4226e” custom_hover_background=”#8d184f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]PREUZMITE predlošci DIVI[/vcex_button][/vc_column][/vc_row]
Ostali Divi tutoriali
- 5 web stranice za restoran korištenja Divi temu
- Kako dodati tekst na proizvod Divi WooCommerce
- Kako promijeniti boju izbornika između Divi stranica
- Kako personalizirati rešetke bloga s Divi-jem
- Kako koristiti uređivač uloga Divija na WordPressu
- Kako stvoriti klizač Divi na cijelom zaslonu
- Kako promijeniti boju izbornika između Divi stranica
- Značajke koje vjerojatno ne znate o Divi-ju
- Kako koristiti Divi Builder na WordPressu
- Kako koristiti modul za pomicanje videozapisa Divi
- Kako koristiti modul Divi Builder Flip
- Kako dodati testimonijalni modul na Divi Builderu
- Kako koristiti tekstualni modul Divi
- Kako stvoriti klizač na Divi
- Kako urediti Divi korisničku ulogu
- Kako koristiti modul Divi Social Media
- Kako se koristi modul trgovine na temi WordPress Divi
- Kako koristiti modul Divi bočne trake
- Kako koristiti modul Divi Table Table
- Kako koristiti naslovni modul Divi publikacija
- Kako dodati video modul Divi
- Kako koristiti navigacijski modul članka
- Kako koristiti modul Divi pretraživanja
- Kako koristiti modul Divi wallet
- Kako koristiti modul osobe na Divi Builderu
- Kako koristiti modul lisnice pomoću Divi filtar
- Kako koristiti modul klizača pune širine
- Kako koristiti modul Divi Builder Image
- Kako koristiti navigacijski modul pune širine Divi Buildera
- Kako se koristi modul galerije slika
- Kako koristiti modul Divi Builder za cijelu širinu kartice
- Kako koristiti modul Divi punog širine portfelja
- Kako se koristi Divi zaglavni modul pune širine
- Kako koristiti modul Divi Counter
- Kako koristiti klizač članaka na Divi Builderu
- Kako koristiti modul Divi Email Optin
Hvala vam na ovoj informaciji, zapravo sam tražio mogućnost postavljanja izbornika na sliku bez aktiviranja područja zaglavlja u Diviju. Je li moguće?
Ovu opciju još nismo testirali.
Bok
Hvala na članku, je li moguće dodati 3. gumb "Tekst gumba # 3" ako je moguće, kako?
CDt,
Naslov govori o izborniku, a sadržaj je blok pune širine ...