Prije nego što svojoj stranici možete dodati modul sažetka, prvo morate pristupiti Divi Builderu. Jednom Divi tema instaliran na vašem web stranica, primijetit ćete gumb Koristite Divi Builder iznad uređivača postova kad god kreirate novu stranicu. Klikom na ovaj gumb aktivirate Divi Builder, koji vam daje pristup svim modulima Divi Builder. Zatim kliknite na gumb Koristite Visual Builder za pokretanje generatora u vizualnom načinu. Također možete kliknuti gumb Koristite Visual Builder kada pregledavate svoje web stranica uzvodno ako ste prijavljeni na nadzornu ploču WordPressa.
Jednom ušli u Visual Builder, možete kliknuti sivi gumb plus da biste dodali novi modul na svoju stranicu. Novi moduli mogu se dodavati samo unutar redaka. Ako započinjete novu stranicu, ne zaboravite prvo dodati redak na svoju stranicu.
Pronađite modul Sažetak 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č "Sažetak", a zatim pritisnuti enter za automatsko pronalaženje i dodavanje opisnog tekstualnog modula! Nakon dodavanja modula, pozdravit će vas popis mogućnosti modula. Te su mogućnosti podijeljene u tri glavne skupine: Sadržaj , Začeće et napredan .
koristite slučaj za popisivanje usluga tvrtke na početnoj stranici
Budući da modul Sažetak kombinira i slike i tekst kako bi prikazao određene značajke, možete ga koristiti za dodavanje popisa usluga vaše tvrtke na početnu stranicu. Modul Blurb također vam omogućuje da svoju sliku / ikonu i naslov pretvorite u vezu na stranicu usluge. U ovom primjeru upotrijebit ću modul Blurb kako bih početnoj stranici dodao četiri istaknute usluge.
Da biste na svoju stranicu dodali sva četiri Blurba, upotrijebite vizualni alat za izgradnju da biste dodali standardni odjeljak s retkom od četiri stupca. Zatim dodajte Blurb modul u prvi stupac vašeg retka.
Ažurirajte postavke Blur sa sljedećim:
Opcije sadržaja
Naslov: [unesite naziv usluge]
Sadržaj: [unesite kratak opis usluge]
URL: [dodajte URL na stranicu usluge]
Upotrijebite ikonu: DA
Ikona: [odaberite ikonu koja ilustrira vašu uslugu]
Mogućnosti dizajna
Boja ikone: # 42bb99 (napravite boju koja nadopunjuje dizajn web stranice)
Upotrijebite ikonu Veličina fonta: DA
Veličina fonta ikone: 68px (podešava veličinu ikone)
Orijentacija teksta: Centar -
Veličina fonta glave: 24 piksela
Veličina fonta: 18px
Visina linije tijela: 1.5em
Sada je završen vaš prvi uvodni tekst.
Sada duplicirajte modul Sažetak koji ste upravo stvorili tri puta i povucite svaki od dupliciranih sažetaka na ostala tri stupca. Budući da su vaše postavke dizajna integrirane u vaše duplicirane module, sve što trebate učiniti je izmijeniti sadržaj (zaglavlje, sadržaj, ikona, URL itd.) i modificirajte boje kako biste ih prilagodili svakoj od svojih usluga.
Opcije sadržaja sadržaja
Na kartici Sadržaj pronaći ćete sav sadržaj modula, poput teksta, slika i ikona. Sve to kontrolira što se pojavljuje u vašem modulu uvijek će biti na ovoj kartici.
Naslov
Dajte svom tekstu naslov koji će se iznad teksta pojaviti podebljanim tekstom. Opcija URL-a koja se nalazi ispod polja Naslov omogućit će vam da naslov napravite hipervezom.
Sadržaj
U ovo polje možete unijeti sadržaj vašeg teksta. Blurb Text također će pokriti cijelu širinu vašeg stupca do 550 px.
URL
U ovo polje stavite valjani web URL kako biste naslov Blurba pretvorili u vezu. Ako ovo polje ostane prazno, naslov će ostati samo statični element.
Otvaranje URL-a
Ovdje možete odabrati hoće li se vaša veza otvoriti u novom prozoru.
Koristite ikonu
Kada koristite Blurbs, možete odabrati upotrebu ikone ili slike s tekstom. Ako odaberete "Da" za opciju "Koristi ikonu", bit će vam ponuđene sljedeće opcije za prilagodbu vaše ikone. Ako ne odlučite koristiti ikonu, od vas će se zatražiti da prenesete sliku.
ikona
Ako ste za postavku "Use icon" odabrali "Yes", pojavit će se ova opcija. Ova vam opcija predstavlja popis dostupnih ikona koje možete koristiti uz svoj blurb. Samo kliknite ikonu koju želite koristiti i ona će se pojaviti u vašem tekstu.
Slika
Ako niste odlučili koristiti ikonu, pojavit će se ova postavka. Ovdje stavite važeći URL slike ili odaberite / prenesite sliku putem biblioteke medija WordPress. Slike u modulu Sažetak uvijek se pojavljuju centrirane u svojim stupcima i obuhvaćaju cijelu širinu stupca do 550 px. Međutim, vaša slika nikada neće biti veća od izvorne veličine za prijenos. Visina prezentacijske slike određuje se omjerom slike izvorne slike. Stoga je poželjno postaviti sve prezentacijske slike na istu visinu ako ih postavljate jednu pored druge.
Boja pozadine
Definirajte prilagođenu boju pozadine za svoj modul ili ostavite prazno da biste koristili zadanu boju.
Pozadinska slika
Ako se postavi, ova će se slika koristiti kao pozadina ovog modula. Da biste uklonili pozadinsku sliku, samo uklonite URL iz polja Postavke. Pozadinske slike pojavit će se na vrhu pozadinskih boja, što znači da vaša boja pozadine neće biti vidljiva kada se primijeni pozadinska slika.
Administratorska oznaka
Ovo će promijeniti oznaku modula u generatoru radi lakše identifikacije. Kada se koristi prikaz WireFrame u Visual Builderu, ove će se oznake pojaviti u bloku modula sučelja Divi Builder.
Sažetak mogućnosti dizajniranja modula
Na kartici Dizajn pronaći ćete sve mogućnosti oblikovanja modula, poput fontova, boja, veličine i razmaka. Ova kartica omogućuje vam izmjenu izgleda vašeg modula. Svaki Divi modul ima dugački popis postavki dizajna pomoću kojih možete prilagoditi gotovo sve.
Boja ikone
Ako ste za postavku "Use icon" odabrali "Yes", pojavit će se ova opcija. Ova vam opcija omogućuje prilagodbu boje vaše ikone. Prema zadanim postavkama ikone su postavljene na boju naglaska vaše teme.
Ikona kruga
Ako ste za postavku "Use icon" odabrali "Yes", pojavit će se ova opcija. Ova vam opcija omogućuje postavljanje ikone u obojeni krug. Ako za ovu postavku odaberete "da", bit će vam ponuđene dodatne mogućnosti za prilagodbu boje i obruba vašeg kruga.
Boja kruga
Ako ste za postavku "Ikona kruga" odabrali "Da", pojavit će se ova opcija. Ovdje možete odabrati boju koju ćete koristiti za svoj krug. Ova boja neovisna je o boji vaše prethodno odabrane ikone. Vaša će se ikona u svojoj boji pojaviti unutar kruga s bojom koju ovdje odaberete.
Pokažite obrub kruga
Ako ste za postavku "Ikona kruga" odabrali "Da", pojavit će se ova opcija. Ova vam opcija omogućuje aktiviranje obruba za vaš krug. Ako je ova opcija odabrana, pojavit će se dodatna opcija za odabir boje obruba.
Boja obruba kruga
Ako ste za postavku "Prikaži granicu kruga" odabrali "Da", pojavit će se ova opcija. Ovdje možete podesiti boju obruba kruga.
Postavljanje slike / ikone
Ovdje možete odabrati mjesto svoje slike/ikone. Može se pojaviti iznad teksta ili lijevo od teksta. Postavljanjem slike/ikone lijevo od teksta, slika će biti manja nego ako se postavi na vrh.
Koristite veličinu fonta ikone
Ako je ova opcija omogućena, možete unijeti prilagođenu veličinu za ikonu prikazanu iznad ili dvije lijevo od vašeg blurba.
Boja teksta
Ako je vaš blurb na tamnoj pozadini, boju teksta treba postaviti na "Dark". Suprotno tome, ako je vaš blurb postavljen na svijetlu pozadinu, boja teksta treba biti postavljena na "Light".
Tekst orijentacija
Ovaj padajući izbornik omogućuje vam da odredite usmjerenje teksta tako da bude poravnato lijevo, centrirano ili desno.
Font zaglavlja
Font zaglavlja možete promijeniti odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima sjajnih 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 podebljane, kurzivne, velike i podcrtane opcije.
Veličina fonta zaglavlja
Ovdje možete prilagoditi veličinu teksta zaglavlja. Možete povući klizač intervala da biste povećali ili smanjili veličinu teksta ili možete izravno unijeti ž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".
Boja teksta zaglavlja
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju zaglavlja, odaberite ovu boju iz alata za odabir boja pomoću ove opcije.
Razmak zaglavlja u slovima
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova teksta zaglavlja, pomoću klizača intervala 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".
Visina reda zaglavlja
Visina retka utječe na razmak između svakog retka teksta zaglavlja. 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 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".
Font tijela
Font vašeg tijela možete promijeniti odabirom željenog fonta s padajućeg izbornika. Divi dolazi s desecima sjajnih 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 podebljane, kurzivne, velike i podcrtane opcije.
Veličina fonta tijela
Ovdje možete prilagoditi veličinu svog teksta. Možete povući klizač intervala da biste povećali ili smanjili veličinu teksta ili možete izravno unijeti ž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".
Boja teksta tijela
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta tijela, odaberite željenu boju iz alata za odabir boja pomoću ove opcije.
Prostor tijela slova
Razmak između slova utječe na razmak između svakog slova. Ako želite povećati razmak između svakog slova vašeg tjelesnog teksta, upotrijebite klizač intervala za podešavanje prostora 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".
Visina tijela linije
Visina retka utječe na razmak između svakog retka osnovnog teksta. Ako želite povećati razmak između svakog retka, pomoću klizača intervala 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".
Koristite granicu
Omogućivanjem ove opcije postavit ćete obrub oko vašeg modula. Ovu granicu možete prilagoditi pomoću sljedećih uvjetnih parametara.
Boja granice
Ova opcija utječe na boju vašeg obruba. Odaberite prilagođenu boju iz alata za odabir boja da biste je primijenili na vaš obrub.
Širina granice
Prema zadanim postavkama, obrubi su široki 1 piksel. Ovu vrijednost možete povećati povlačenjem klizača raspona ili unosom prilagođene vrijednosti u polje za unos s desne strane klizača. Podržite prilagođene mjerne jedinice, što znači da možete promijeniti zadanu jedinicu iz "px" u nešto drugo poput em, vh, vw itd.
Granični stil
Granice podržavaju osam različitih stilova, uključujući: pune, točkaste, točkaste, dvostruke, žlijeb, greben, umetak i početak. Na padajućem izborniku odaberite stil koji želite primijeniti na vašu granicu.
Maksimalna širina slike
Primjenom vrijednosti maksimalne širine ovdje ograničit ćete širinu prezentacijske slike. To utječe samo na nejasne slike koje nisu u načinu ikone.
Prilagođena marža
Margina je prostor dodan s vanjske strane vašeg modula, između modula i sljedećeg elementa iznad, ispod ili slijeva i zdesna od njega. Možete dodati prilagođene vrijednosti margina na bilo koju od četiri strane modula. Da biste uklonili prilagođenu marginu, uklonite dodanu vrijednost iz polja za unos. Te se vrijednosti prema zadanim postavkama mjere u pikselima, ali u polja za unos možete unijeti prilagođene mjerne jedinice.
Custom padding
Padding je prostor dodan unutar vašeg modula, između ruba modula i njegovih unutarnjih elemenata. Možete dodati prilagođene vrijednosti popunjavanja na bilo koju od četiri strane modula. Da biste uklonili prilagođenu marginu, uklonite dodanu vrijednost iz polja za unos. Te se vrijednosti prema zadanim postavkama mjere u pikselima, ali u polja za unos možete unijeti prilagođene mjerne jedinice.
Napredne opcije Modul sažetka
Na kartici Napredno 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. Također možete primijeniti prilagođene CSS klase i ID-ove na modul, 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. Ovi razredi se mogu koristiti u vašem Divi tema Dijete ili u prilagođenom CSS-u koji dodajete na svoju stranicu ili svoju 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 elemenata modula. U odjeljku Prilagođeni CSS pronaći ćete tekstualno polje u koje možete dodati CSS izravno u svaki element. CSS unosi u ovim postavkama već su ugrađeni sa stilskim oznakama. Dakle, morate unijeti CSS pravila odvojena zarezom.
Animacija slike / ikone
Ovo kontrolira smjer lijene animacije učitavanja.
ALT tekst sa slike
Ako niste odlučili koristiti ikonu, pojavit će se ova postavka. Ostali tekst pruža sve potrebne informacije ako se slika ne učitava, prikazuje ispravno ili u bilo kojoj drugoj situaciji u kojoj korisnik ne može vidjeti sliku. Omogućuje i čitanje i prepoznavanje slike na tražilicama.
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 mobilni dizajn uklanjanjem nekih elemenata sa stranice.
To je sve za ovaj vodič. Nadamo se da smo vam pokazali kako koristiti sažeti modul na Divi.
Pozdrav,
Želim koristiti modul sažetka za umetanje oko 200 sličica na stranicu.
Svaka sličica predstavlja naslov proizvoda na prodaju, ali ne želim koristiti woocommerce, samo vezu za kontakt ...
Ova će se stranica redovito ažurirati s novim sličicama.
Ove minijature (dakle 200 sažetkih modula) trebaju biti navedene po abecednom redu (na temelju naslova), također kad dodam nove module na kraju stranice ...
Znate li kako sam to mogao učiniti?
merci beaucoup