Cu modulul Portofoliu Divi, vă puteți arăta munca oriunde pe site-ul dvs. cu orice structură de coloane. În acest tutorial, vă voi arăta cum să utilizați modulul portofel pe Divi.
Cum se adaugă un modul de Wallet de la Divi
Înainte de a putea adăuga un modul de portofoliu la pagina dvs., trebuie mai întâi să accesați Divi Builder. Odata ce Divi tema instalat pe dvs site-ul web, veți observa un buton Utilizați Divi Builder deasupra editorului de postare ori de câte ori creați o pagină nouă. Faceți clic pe acest buton pentru a activa Divi Builder și pentru a accesa toate modulele Divi Builder. Apoi faceți clic pe buton Utilizați Visual Builder pentru a porni generatorul în modul vizual. De asemenea, puteți face clic pe buton Utilizați Visual Builder când răsfoiți dvs site-ul web în prim-plan dacă sunteți conectat la tabloul de bord WordPress.
După ce ați intrat în Visual Builder, puteți face clic pe butonul plus gri pentru a adăuga un nou modul la pagina dvs. Modulele noi pot fi adăugate numai în rânduri. Dacă începeți o pagină nouă, nu uitați să adăugați mai întâi un rând la pagina dvs.
Găsiți modulul de portofoliu în lista de module și faceți clic pe acesta pentru a-l adăuga la pagina dvs. Lista modulelor poate fi căutată, ceea ce înseamnă că puteți introduce și cuvântul „portofoliu” și apoi faceți clic pe „Enter” pentru a găsi și adăuga automat modulul portofoliu! Odată adăugat modulul, veți fi întâmpinat de lista de opțiuni a modulului. Aceste opțiuni sunt separate în trei grupe principale: Conținut , Concepție et avansat .
Exemplu de utilizare: Adăugarea unui modul de portofoliu la o pagină de portofoliu
Pentru acest exemplu, vă voi arăta cum puteți prezenta un portofoliu pe o pagină de portofoliu.
Să începem.
Utilizați generatorul vizual pentru a adăuga o secțiune obișnuită cu un rând cu lățime completă (1 coloană) sub antetul paginii. Apoi adăugați un modul de portofoliu filtrabil pe rând.
Actualizați setările portofelului după cum urmează:
Opțiuni de conținut
Număr de articole: 8
Afișare paginare: NU
Opțiuni de proiectare
Layout: Grilă
Pictograma de culoare zoom: #ffffff
Hover Overlay Culoare: rgba (224,153,0,0.58)
Titlul fontului: implicit, cu caractere aldine, cu majuscule
Dimensiune font Titlu: 14px
Spațiu pentru literă titlu: 1px
Dimensiunea fontului Meta: 12px
Mărimea literelor Meta: 1px
Opțiuni avansate (CSS personalizate)
Titlu portofoliu:
text-align: centru;
Portofoliul de mesaje Meta:
text-align: centru;
Asta e tot!
Opțiuni privind conținutul portofoliului
În fila conținut, veți găsi toate elementele de conținut ale modulului, cum ar fi text, imagini și pictograme. Toate acestea controlează ce apare în modulul dvs. va fi întotdeauna găsit în această filă.
Numărul de articol
Controlați numărul de proiecte afișate Lăsați gol sau folosiți 0 pentru a nu limita numărul.
Includeți categorii
Alegeți categoriile pe care doriți să le afișați. Proiectele din categorii care nu sunt selectate nu vor apărea în lista proiectelor.
Afișați titlul
Alegeți dacă titlul fiecărui proiect este afișat sau nu când treceți mouse-ul peste elementul proiectului.
Afișați categoriile
Aici puteți activa sau dezactiva legăturile de categorie.
Vizualizați paginarea
Aici puteți activa sau dezactiva paginarea pentru acest flux.
Culoarea de fundal
Definiți o culoare de fundal personalizată pentru modulul dvs. sau lăsați necompletat pentru a utiliza culoarea implicită.
Imagine de fundal
Dacă este setată, această imagine va fi folosită ca fundal pentru acest modul. Pentru a elimina o imagine de fundal, trebuie doar să eliminați adresa URL din câmpul de setări. Imaginile de fundal vor apărea deasupra culorilor de fundal, ceea ce înseamnă că culoarea de fundal nu va fi vizibilă atunci când se aplică o imagine de fundal.
Admin Label
Aceasta va schimba eticheta modulului din constructor pentru o identificare ușoară. Când utilizați vizualizarea WireFrame în Visual Builder, aceste etichete apar în blocul de module din interfața Divi Builder.
Opțiuni de proiectare a modulelor portofoliului
În fila Proiectare, veți găsi toate opțiunile de stilare a modulului, cum ar fi fonturile, culorile, dimensionarea și spațiul. Aceasta este fila pe care o veți utiliza pentru a schimba aspectul modulului dvs. Fiecare modul Divi are o listă lungă de setări de proiectare pe care le puteți utiliza pentru a schimba orice.
Dispoziţie
Alegeți aspectul pe care doriți să îl utilizați. „Grilă” va afișa toate articolele dvs. într-un aspect cu mai multe coloane și mai multe rânduri. Lățimea completă afișează fiecare proiect pe propriul rând folosind imagini mari, netăiate și cu lățime mare.
Culoare pictogramă zoom
Când plasați cursorul peste un element din modulul portofoliu, apare o pictogramă de suprapunere. Puteți regla culoarea utilizată pentru această pictogramă utilizând selectorul de culori din această setare.
Culoarea stratului de pe flyover
Când plasați cursorul peste un element din modulul portofoliu, apare o culoare de suprapunere în partea de sus a imaginii și sub textul și pictograma titlului portofoliului. În mod implicit, se utilizează o culoare albă semitransparentă. Dacă doriți să utilizați o culoare diferită, puteți regla culoarea folosind selectorul de culori din această setare
Pictograma de selectare a cursorului
Aici puteți alege o pictogramă personalizată pentru a fi afișată atunci când un vizitator trece deasupra articolelor din portofoliu din modul.
Culoarea textului
Aici puteți alege dacă textul dvs. ar trebui să fie clar sau întunecat.
Fonturi de titlu
Puteți modifica fontul textului titlului selectând fontul dorit din meniul derulant. Divi vine cu zeci de fonturi grozave alimentate de Google Fonts. În mod implicit, Divi folosește fontul Open Sans pentru tot textul de pe pagina dvs. De asemenea, puteți personaliza stilul textului dvs. folosind opțiuni aldine, cursive, cu majuscule și cu subliniere.
Dimensiunea fontului titlului
Aici puteți regla dimensiunea textului din titlu. Puteți trage glisorul de raza de acțiune pentru a mări sau micșora dimensiunea textului sau introduceți direct valoarea dimensiunii textului dorit în câmpul de introducere din dreapta glisorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Culoarea textului titlului
În mod implicit, toate culorile textului din Divi apar în alb sau gri închis. Dacă doriți să modificați culoarea textului titlului dvs., alegeți culoarea dorită din selectorul de culori folosind această opțiune.
Spațierea literelor de titlu
Spațierea literelor afectează spațiul dintre fiecare literă. Dacă doriți să măriți spațiul dintre fiecare literă din textul titlului, utilizați glisorul de interval pentru a regla spațiul sau introduceți dimensiunea de spațiu dorită în câmpul de introducere din dreapta glisorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Înălțimea liniei de titlu
Înălțimea liniei afectează spațiul dintre fiecare linie a textului titlului dvs. Dacă doriți să măriți spațiul dintre fiecare linie, utilizați glisorul pentru a regla spațiul sau introduceți dimensiunea de spațiu dorită în câmpul de introducere situat în dreapta cursorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Fontul Metas
Puteți schimba fontul meta textului dvs. selectând fontul dorit din meniul derulant. Divi vine cu zeci de fonturi grozave alimentate de Google Fonts. În mod implicit, Divi folosește fontul Open Sans pentru tot textul de pe pagina dvs. De asemenea, puteți personaliza stilul textului dvs. folosind opțiuni aldine, italice, cu majuscule și cu subliniere.
Dimensiunea fontului Metas
Aici puteți regla dimensiunea meta-textului. Puteți trage glisorul de raza de acțiune pentru a mări sau micșora dimensiunea textului sau introduceți direct valoarea dimensiunii textului dorit în câmpul de introducere din dreapta glisorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Meta text color
În mod implicit, toate culorile textului din Divi apar în alb sau gri închis. Dacă doriți să modificați culoarea meta-textului, alegeți culoarea dorită din selectorul de culori folosind această opțiune.
Meta Spațiere între litere
Spațierea literelor afectează spațiul dintre fiecare literă. Dacă doriți să măriți spațiul dintre fiecare literă din meta-text, utilizați glisorul de interval pentru a regla spațiul sau introduceți dimensiunea de spațiu dorită în câmpul de intrare din dreapta glisorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Înălțimea legăturilor în zona meta
Înălțimea liniei afectează spațiul dintre fiecare linie a meta-textului dvs. Dacă doriți să măriți spațiul dintre fiecare linie, utilizați glisorul pentru a regla spațiul sau introduceți dimensiunea de spațiu dorită în câmpul de introducere situat în dreapta cursorului. Câmpurile de intrare acceptă diferite unități de măsură, ceea ce înseamnă că puteți introduce „px” sau „em” în funcție de valoarea mărimii dvs. pentru a-i schimba tipul de unitate.
Utilizați marginea
Activarea acestei opțiuni va plasa o margine în jurul modulului. Această margine poate fi personalizată utilizând următorii parametri condiționali.
Culoarea frontierei
Această opțiune afectează culoarea chenarului. Selectați o culoare personalizată din selectorul de culori pentru ao aplica la bordura dvs.
Lățimea frontierei
În mod implicit, marginile au o lățime de 1 pixel. Puteți crește această valoare trăgând glisorul de interval sau introducând o valoare personalizată în câmpul de introducere din dreapta glisorului. Unități de măsură personalizate acceptate, ceea ce înseamnă că puteți schimba unitatea implicită din „px” în altceva precum em, vh, vw etc.
Stilul de frontieră
Bordurile acceptă opt stiluri diferite: solid, punctat, punctat, dublu, șanț, creastă, suprapunere și start. Selectați stilul dorit din meniul derulant pentru a-l aplica la chenar.
Opțiuni avansate de portofoliu
În fila avansată, veți găsi opțiuni pe care designerii web mai experimentați le-ar putea găsi utile, cum ar fi atributele CSS și HTML personalizate. Aici puteți aplica CSS personalizat oricăruia dintre numeroasele elemente ale modulului. De asemenea, puteți aplica clase și ID-uri CSS personalizate modulului, care pot fi utilizate pentru a personaliza modulul în fișierul style.css al temei copilului dvs.
Cod CSS
Introduceți un ID CSS opțional de utilizat pentru acest modul. Un ID poate fi folosit pentru a crea un stil CSS personalizat sau pentru a crea legături către anumite secțiuni ale paginii dvs.
CSS
Introduceți clasele CSS opționale de utilizat pentru acest modul. O clasă CSS poate fi utilizată pentru a crea stiluri CSS personalizate. Puteți adăuga mai multe clase, separate printr-un spațiu. Aceste clase pot fi folosite în tema copilului Divi sau în foaia de stil CSS personalizată pe care o adăugați la pagina sau site-ul dvs. site-ul web folosind opțiunile temei Divi sau setările paginii Divi Builder.
CSS personalizate
CSS personalizat poate fi, de asemenea, aplicat modulului și oricărui intern al modulului. În secțiunea CSS personalizată, veți găsi un câmp de text în care puteți adăuga foi de stil CSS personalizate direct la fiecare element. Intrările CSS din aceste setări sunt deja înfășurate în etichetele de stil. Deci, introduceți regulile CSS separate prin punct și virgulă.
vizibilitate
Această opțiune vă permite să controlați dispozitivele pe care apare modulul dvs. Puteți alege să vă dezactivați modulul individual pe tablete, smartphone-uri sau desktop-uri. Acest lucru este util dacă doriți să utilizați moduri diferite pe diferite dispozitive sau dacă doriți să simplificați designul mobil prin eliminarea anumitor elemente de pe pagină.
[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”]DESCĂRCĂ TEMA DIVI [/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”]DESCARCĂ ȘABLOANELOR DIVI[/vcex_button][/vc_column][/vc_row]
Alte tutoriale Divi
- site-uri web 5 pentru utilizare restaurant tematic Divi
- Cum să adăugați text pe un produs Divi WooCommerce
- Modificarea culorii meniului între paginile Divi
- Cum să personalizați grilele unui blog cu Divi
- Cum de a utiliza rolul editor Divi pe WordPress
- Cum se creează un glisor Divi pe ecran complet
- Modificarea culorii meniurilor între paginile Divi
- Caracteristici pe care probabil nu le cunoașteți despre Divi
- Cum se utilizează Divi Builder pe WordPress
- Cum se utilizează modulul de defilare video Divi
- Cum se utilizează modulul Divi Builder Flip
- Cum să adăugați un modul de mărturie pe Divi Builder
- Cum se utilizează modulul de text Divi
- Cum se creează un slider pe Divi
- Cum se editează un rol de utilizator Divi
- Cum se utilizează modulul Divi Social Media
- Cum se utilizează modulul magazin pe tema WordPress Divi
- Cum se utilizează modulul bara laterală Divi
- Cum se utilizează modulul de prețuri pentru divi
- Cum se utilizează modulul de titlu al publicațiilor Divi
- Cum se adaugă un modul video de Divi
- Cum să utilizați modulul de navigare pentru articole
- Cum se utilizează modulul de căutare Divi
- Cum se utilizează modulul portofel Divi
- Cum se utilizează modulul persoană pe Divi Builder
- Cum se utilizează modulul portofel cu filtrul Divi
- Modul de utilizare a modulului glisant cu lățime întreagă
- Cum se utilizează modulul de imagine Divi Builder
- Modul de utilizare a modulelor de navigație full-width din Divi Builder
- Cum se utilizează modulul galerie de imagini
- Modul de utilizare a modulului de carduri cu dimensiuni multiple de la Divi Builder
- Cum să utilizați modulul de portofoliu Full Width Divi
- Cum se utilizează modulul antet de Divi pentru lățimea completă
- Cum se utilizează modulul Counter Modul Divi
- Cum se utilizează glisorul de articole pe Divi Builder
- Cum se utilizează modulul Divi Email Optin
Ciao, este posibil să ai un portofoliu pe 3 coloane a scorrimento? Siccome ho many elements da visualizzare, vorrei far sì che venissero visualized as delle slide che scorrono verso sx… No so se ho reso the idea ... Grazie!
Bună ziua, aș vrea să știu dacă este posibil să aveți o prezentare sub forma unei grile cu trei coloane și nu patru. În mod implicit, proiectele mele sunt aliniate pe patru orizontal și, așa cum am vrut să pun șase, mi-aș fi dorit să am o prezentare pe trei coloane și două rânduri. Am căutat printre opțiuni, dar nu am găsit nimic despre asta ...
Multumesc anticipat pentru ajutor.
Bună, îmi poți explica de ce există un spațiu foarte mare între fiecare coloană din portofoliul meu, sub elemente. Nu în stânga și în dreapta, ci mai degrabă sub rânduri. Mulțumesc foarte mult.
Bună ziua, dacă avem o imagine de ansamblu, vă putem sfătui mai bine.
Mărfuri.
Captura de ecran 2019-09-21 la 14.49.53 copie.jpg
Bună ziua, postarea dvs. nu conține un link către captura de ecran. Puteți utiliza acest instrument pentru a face acest lucru: https://screenshot.net/fr/
Buna,
Știți dacă este posibil să adăugați un extras vizibil în portofoliu sub titlu?
Multumesc anticipat
Buna seara Sally,
Nu este testat încă.