Kako koristiti modul Toggle na Divi Builderu: Vodič

Prije nego što svojoj stranici možete dodati modul Toggle, 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.

Kad ste na Visual Builderu, možete kliknuti sivi gumb plus da biste na svoju stranicu dodali novi modul. Novi moduli mogu se dodavati samo unutar redaka. Ako započinjete novu stranicu, ne zaboravite prvo dodati redak na svoju stranicu.

Pronađite preklopni modul na popisu modula i kliknite ga da biste ga dodali na svoju stranicu. Popis modula je pretraživ, što znači da možete i utipkati "prebaci", a zatim pritisnuti enter da biste pronašli i automatski dodali preklopni modul! 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: stranica s čestim pitanjima

Stranica s čestim pitanjima jedno je od najboljih mjesta za objedinjavanje podataka pomoću modula Toggle. Omogućuje korisniku brzo prepoznavanje pitanja koje traži bez potrebe za čitanjem tona teksta. U ovom primjeru pokazat ću vam kako pomoću modula Toggle možete dizajnirati moderan odjeljak s čestim pitanjima za stranicu s čestim pitanjima za nekoliko minuta.

Pomoću Visual Builder-a dodajte novi odjeljak s retkom pune širine (1 stupac). Zatim u red dodajte modul Razdjelnik. Na kartici Sadržaj postavki modula Razdjelnik odaberite opciju "Prikaži razdjelnik".

Na kartici Dizajn unesite sljedeće mogućnosti:

Boja: # 000000 (crna)
Stil razdjelnika: Čvrsta
Pozicija razdvajača:
Okomito centrirani razdjelnik Težina: 4px
Visina: 1

Zatim dodajte preklopni modul ispod razdjelnika koji sam upravo stvorio u istom redu. U postavkama Toggle modula ažurirajte sljedeće:

Kartica Sadržaj

Naslov: [unesite svoj naslov]
Sadržaj: [unesite svoj sadržaj]
Status: Zatvori
Boja otvorene pozadine: #ffffff
Zatvoreno Prebacivanje boje pozadine: #ffffff
Boja pozadine: #ffffff

Kartica Dizajn

Boja ikone: # 000000
Otvori Toggle boju teksta: # 000000
Zatvorena boja tekućeg teksta: # 000000
Font slova: Otvori bez, podebljano
Veličina slova: 24px
Tekst teksta u tekstu: # 000000
Font tijela: otvorena ne
Veličina slova tijela: 18px
Boja teksta tijela: # 666666
Visina linije tijela: 1.6em
Koristite granicu: YES
Širina granice: 0px
Prilagođeni padding: gornji 2px, donji 2px

Nakon spremanja postavke za preklopni modul, duplicirajte razdjelni modul koji ste stvorili i stavite ga pod preklopni modul. To će klackalicu uokviriti gornjom i donjom razdjelnicom. Nakon toga duplicirajte svoj preklopni modul i stavite ga nakon donje crte odvajača. Budući da je ovo duplicirani Toggle modul, sve postavke dizajna prenesene su na novi Toggle modul i sve što trebate je ažurirati sadržaj novog Toggle modula. Zatim nastavite s postupkom umnožavanja modula Podjela i moduli razmjera i ažurirajte sadržaj svojih ljestvica dok ne popunite cijeli odjeljak s čestim pitanjima.

To je sve. Sada imate moderni odjeljak s čestim pitanjima koji koriste modul Toggle za objedinjavanje vaših pitanja i odgovora.

Sad kad ste vidjeli kako modul za prebacivanje djeluje, zaronite u SVE njegove postavke u odjeljcima ispod. Pružili smo detaljan pregled onoga što ćete pronaći na svakoj kartici postavki modula i objašnjenje što svaki od njih radi.

Sadržajni parametri modula Toggle

Kartica sadržaja preklopnog modula organizirana je u sljedeće skupine parametara (koje se također izmjenjuju!).

Tekstovi

Ovdje možete dodati naslov i prebaciti sadržaj.

Etat

Ovom postavkom možete odabrati želite li da se vaš gumb po zadanom pojavljuje otvoren ili zatvoren.

kontekst

Ovdje možete promijeniti boju pozadine kada je prekidač otvoren i boju pozadine kada je zatvorena. Jednostavno ih možete učiniti jednakim postavljanjem opcije boje pozadine. Postoji i mogućnost postavljanja ili prijenosa pozadinske slike.

Administratorska oznaka

Prema zadanim postavkama, vaš će se modul za prebacivanje pojaviti s oznakom koja u generatoru glasi "Prebaci". Admin oznaka omogućuje vam promjenu ove oznake radi lakše identifikacije.

Konstrukcijski parametri rocker modula

Parametri dizajna preklopnog modula grupirani su u sljedećim padajućim preklopnicima na kartici Dizajn.

ikona

Ovdje možete promijeniti boju ikone za prebacivanje.

Tekstovi

Ovdje možete postaviti boju za otvoren i zatvoren preklopni tekst.

Tekst naslova

Ovdje možete prilagoditi font teksta naslova, težinu, veličinu, boju, razmak, visinu retka i još mnogo toga.

Tijelo teksta

Ovdje možete prilagoditi font, težinu, veličinu, boju, razmak, visinu retka i još mnogo toga.

granice

Ovdje možete odabrati upotrebu obruba. A ako odlučite koristiti obrub, također možete odabrati njegovu boju, promijeniti širinu i odabrati stil.

razmak

U razmaku možete dodati prilagođene obloge gore, desno, dno ili lijevo od preklopnika. Te vrijednosti možete promijeniti i za stolna računala, tablete ili mobilne uređaje.

Napredne postavke prebacivanja modula

Na kartici Napredno modula za prebacivanje možete dodati jedinstveni ID i css klasu. Također možete dodati prilagođeni css raznim unaprijed definiranim (i unaprijed odabranim) css biračima u prilagođenom css padajućem modulu video klizača. Konačno, na padajućem popisu vidljivosti možete prilagoditi vidljivost svog modula na telefonima, tabletima i radnim površinama.

To je sve za ovaj vodič, nadam se da će vam omogućiti bolju upotrebu modula Divi Toggle.

[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]

Kako koristiti modul Divi Builder Flip