Modul Divi Person najbolji je način za stvaranje bloka Osobnog profila. Ovo je izvrstan dodatak za upotrebu na stranicama O meni ili onima koji sadrže članove tima gdje želite stvoriti biografiju pojedinih ljudi. Ovaj modul kombinirao je tekst, slike i veze na društvenim mrežama u jedan kohezivni modul.
Kako konfigurirati modul Divi Person
Prije nego što svojoj stranici možete dodati modul Divi Person, 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 Koristite 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 mogu se dodavati samo unutar redaka. Ako započinjete novu stranicu, ne zaboravite prvo dodati redak na svoju stranicu. Imamo sjajne vodiče o korištenju elemenata linije i dijelovi od Divi.
Pronađite modul osobe 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 riječ "osoba", a zatim kliknuti enter da biste automatski pronašli i dodali modul Osoba! 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 odjeljka "Naš tim" na stranicu O nama
Stranica o nama dobro je mjesto za upoznavanje članova vašeg tima pomoću modula Person. Dodaje osobni dodir i može pomoći u izgradnji povjerenja kod novih kupaca.
U ovom primjeru pokazat ću vam kako pomoću modula Person dodati odjeljak "Naš tim" na stranicu o maloj tvrtki. Koristit ću raspored od tri osobe s tri stupca koji će odjeljak održati kompaktnijim i odgovarati cjelokupnom dizajnu stranice.
Pomoću Visual Builder-a umetnite novi standardni odjeljak s redom od tri stupca (1/3 1/3 1/3). Zatim dodajte modul Person u prvi stupac.
Ažurirajte postavke modula Osoba na sljedeći način:
Opcije sadržaja
Ime: [Unesite ime osobe]
Položaj: [Unesite poziciju osobe]
Unesite URL-ove profila na društvenim mrežama
Opis: [Unesite kratku biografiju]
Slika: [Snimite sliku 600 x 600]
Mogućnosti dizajna
Ikona u boji: # fcbf00
Zadržite pokazivač miša u boji: # e0a831
Font zaglavlja: Roboto, podebljano, prijeđite na
Veličina fonta zaglavlja: 30 piksela
Boja teksta zaglavlja: # 505050
Razmak zaglavlja slova: 1 piksela
Visina reda zaglavlja: 1.5em
Veličina fonta tijela: 18 piksela
Veličina linije tijela: 1.4em
Prilagođeno oblaganje: 15px gore, 15px desno, 15px dolje, 15px lijevo
Napredne opcije (prilagođeni CSS)
Glavni element:
-webkit-box-shadow: 0 1px 5px rgba (0, 0, 0, 0.2)
-moz-box-shadow: 0 1px 5px rgba (0, 0, 0, 0,2);
okvirna sjena: 0 1px 5px rgba (0, 0, 0, 0,2);
Spremite postavke
Sada dvaput duplicirajte modul Person koji ste upravo stvorili i povucite duplicirane module u drugi i treći stupac u retku. Budući da je dizajn prenesen za svaki od dupliciranih modula "Osoba", sve što trebate jest ažurirati sadržaj slikom, naslovom, položajem, URL-ovima i opisom na društvenim mrežama. osobe.
To je sve!
Opcije sadržaja osoba
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.
Ime
Ovo je ime osobe koju uvodite. Naziv je prikazan na vrhu modula u većem tekstu.
Položaj
Položaj je prikazan ispod imena u manjem tekstu. To se često koristi za označavanje profesionalnog položaja osobe u korporativnom timu. Na primjer, Nick Roach, "Grafički dizajner".
URL profila Facebooka
Unesite URL na svojoj Facebook stranici ili ga ostavite praznim da biste onemogućili ikonu Facebook.
URL profila za Twitter
Unesite URL na svoju stranicu na Twitteru ili ga ostavite praznim da biste isključili ikonu Twitter.
URL profila na usluzi Google+
Unesite URL na svoju Google+ stranicu ili ga ostavite praznim da biste isključili ikonu Google+.
LinkedIn URL profila
Unesite URL na svoju stranicu LinkedIn ili ga ostavite praznim da biste isključili ikonu LinkedIn.
Opis
Ovdje unesite sadržaj glavnog teksta svog modula.
Slika URL
Ovdje možete preuzeti fotografiju za upotrebu u biografiji.
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 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.
Administratorska oznaka
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.
Mogućnosti dizajna za modul Person
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.
Boja ikone
Ova opcija kontrolira boju ikona društvenih mreža koje se pojavljuju u profilu svake osobe. Prema zadanim postavkama ove su ikone sive, a ovu boju možete promijeniti pomoću ove postavke.
Boja ikone pri zadržavanju pokazivača miša
Također možete promijeniti boju lebdenja ikona društvenih mreža. Odaberite željenu boju pomoću alata za odabir boja u ovoj postavci.
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.
Font zaglavlja
Font teksta zaglavlja 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 fonta zaglavlja
Ovdje možete prilagoditi veličinu teksta zaglavlja. 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 zaglavlja
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta zaglavlja, odaberite željenu 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 u tekstu zaglavlja, 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 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 polje za unos 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 tijela
Font vašeg tijela 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 fonta tijela
Ovdje možete prilagoditi veličinu teksta tijela. 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 tijela
Prema zadanim postavkama, sve boje teksta u Diviju pojavljuju se u bijeloj ili tamno sivoj boji. Ako želite promijeniti boju teksta, 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 u tekstu, 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 tijela linije
Visina retka utječe na razmak između svakog retka teksta u vašem tijelu. 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.
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
Granice su prema zadanim postavkama široke 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žane prilagođene jedinice mjere, š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: puni, točkasti, točkasti, dvostruki, žlijeb, greben, sloj i početak. Na padajućem izborniku odaberite svoj željeni stil da biste ga primijenili na vašu granicu.
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
Ispunjavanje 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 mogućnosti modula Osoba
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.
Animacija
Prema zadanim postavkama slike se animiraju dok pomičete stranicu. Ovdje možete odabrati smjer animacije ili ga deaktivirati.
vidljivost
Ova vam opcija omogućuje upravljanje uređajima na kojima se pojavljuje vaš modul. Možete pojedinačno onemogućiti svoj modul na tabletima, pametnim telefonima ili radnim površinama. 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
Pozdrav,
Hvala vam na ovim vrlo korisnim člancima.
Poput URL-ova na Facebook, Twitter, Google+ ili LinkedIn, znate li je li moguće dodati URL svom Instagram profilu, molim vas? Hvala 🙂
Salut!
Kada izradim projekt ili objavu i koristim mahunu Osoba, zašto polje Položaj nestaje kad pregledavam projekte ili postove pomoću bloga ili bloga koji se može filtrirati?
Kako učiniti da polje Položaj osobe bude vidljivo u prikazu Blog Grid?
Hvala!
Dobra večer i hvala na čekanju.
Moduli za pretraživanje obično ne izvršavaju kratke kodove. Stoga modul Person (kao i bilo koji drugi modul) generira kratki kôd koji se može prikazati samo pregledom članka ili stranice, a ne iz modula koji nudi pregled navedenog članka ili stranice.