A Divi Person modul a személyes profilblokk létrehozásának legjobb módja. Ez egy remek kiegészítő a Rólam oldalakra vagy azokra a csapattagokkal rendelkező oldalakra, ahol egyéni embereket szeretne létrehozni. Ez a modul a szöveges, képi és a közösségi média linkeket egy összetartó modulba egyesítette.

A Divi Person modul konfigurálása

Mielőtt Divi Person modult adhatna az oldalához, először be kell ugrania a Divi Builderbe. Egyszer a Divi téma telepítve az Önre weboldal, akkor észrevesz egy gombot Használja a Divi Buildert a bejegyzésszerkesztő felett, amikor új oldalt hoz létre. Kattintson erre a gombra a Divi Builder aktiválásához és az összes Divi Builder modul eléréséhez. Ezután kattintson a gombra Használja a Visual Builder alkalmazást hogy a generátort vizuális módban indítsa el. Kattintson a gombra is Használja a Visual Builder alkalmazást amikor böngészi a weboldal az előtérben, ha be van jelentkezve a WordPress irányítópultjába.

Miután belépett a Visual Builder programba, a szürke plusz gombra kattintva új modult adhat hozzá az oldalához. Új modulok csak sorok belsejében adhatók hozzá. Ha új oldalt indít, ne felejtse el először hozzáadni egy sort az oldalához. Remek oktatóanyagok vannak a lignes és szakaszok írta Divi.

Keresse meg a személy modult a modulok listájában, és kattintson rá, hogy hozzáadja az oldalához. A modulok listája kereshető, ami azt jelenti, hogy beírhatja a "személy" szót is, majd az Enter gombra kattintva automatikusan megtalálja és hozzáadja a Személy modult! A modul hozzáadása után a modul opcióinak listája fogadja. Ezeket az opciókat három fő csoportra osztják: Tartalom , Fogamzás et fejlett .

Példa felhasználási esetre: A "Csapatunk" szakasz hozzáadása a Rólunk oldalhoz

A Rólunk oldal jó hely arra, hogy bemutassa csapattagjait a Person modul segítségével. Személyes kapcsolatot kölcsönöz, és segíthet az új ügyfelek bizalmának kiépítésében.

Ebben a példában megmutatom, hogyan használhatja a Személy modult a "Csapatunk" rész hozzáadásához egy kisvállalkozásról szóló oldalhoz. Háromszemélyes, három oszlopos elrendezést fogok használni, amely kompaktabbá teszi a részt és megfelel az oldal általános kialakításának.

A Visual Builder használatával illesszen be egy új szabványos részt három oszlop sorával (1/3 1/3 1/3). Ezután adjon hozzá egy Személy modult az első oszlophoz.

Frissítse a Személy modul beállításait az alábbiak szerint:

Tartalom opciók

Név: [Adja meg a személy nevét]
Pozíció: [Adja meg a személy kiterjesztését]
Adja meg a közösségimédia-profilok URL-címét
Leírás: [Írjon be egy rövid életrajzot]
Kép: [600 x 600-as kép rögzítése]

Tervezési lehetőségek

Színes ikon: # fcbf00
A lebegő ikon színe: # e0a831
Fejléc betűtípusa: Roboto, félkövér, tőkeáttételes
Fejléc betűmérete: 30 képpont
Fejléc szövegszíne: # 505050
Levél fejlécének távolsága: 1 kép
Fejléc magassága: 1.5em
Törzs betűmérete: 18 képpont
Testvonal mérete: 1.4em
Egyéni padding: 15px fel, 15px jobb, 15px le, 15px bal

Speciális beállítások (egyedi CSS)

Fő elem:
-webkit-box-shadow: 0 1px 5px rgba (0, 0, 0, 0.2)
-moz-box-shadow: 0 1px 5px rgba (0, 0, 0, 0,2);
doboz árnyék: 0 1px 5px rgba (0, 0, 0, 0,2);

A beállítások mentése

Most duplázza az imént létrehozott Személy modult kétszer, és húzza a duplikált modulokat a sor második és harmadik oszlopába. Mivel a duplikált „Személy” modulok mindegyikének tervét átvitték, csak annyit kell tennie, hogy frissíti a tartalmat a képpel, a címmel, a pozícióval, a közösségi média URL-jeivel és a leírásával. a személy.

Ez az!

Személy Tartalom Opciók

A Tartalom fülön megtalálja a modul összes tartalmi elemét, például szöveget, képeket és ikonokat. Minden, ami irányít mi jelenik meg a modulban, mindig megtalálható ezen a lapon.

First Name

Ez annak a személynek a neve, akit bemutat. A név a modul tetején jelenik meg nagyobb szövegben.

pozíció

A pozíció a név alatt jelenik meg kisebb szövegben. Ezt gyakran arra használják, hogy a személy egy vállalati csapatban betöltött szakmai helyzetére utaljanak. Például Nick Roach, "grafikus".

Facebook profil URL

Írja be az URL-t a Facebook-oldalára, vagy hagyja üresen a Facebook ikonjának kikapcsolásához.

Twitter profil URL-je

Írja be az URL-t a Twitter oldalán, vagy hagyja üresen a Twitter ikon kikapcsolásához.

Google+ profil URL

Írja be az URL-t a Google+ oldalán, vagy hagyja üresen a Google+ ikon kikapcsolásához.

LinkedIn profil URL-je

Írja be az URL-t a LinkedIn oldalán, vagy hagyja üresen a LinkedIn ikon kikapcsolásához.

Leírás

Itt adhatja meg a modul fő szövegének tartalmát.

Kép URL

Itt letölthet egy fotót, amelyet felhasználhat az életrajzban.

Háttérszín

Adjon meg egyedi háttérszínt a modulhoz, vagy hagyja üresen az alapértelmezett szín használatához.

Háttérkép

Ha be van állítva, akkor ezt a képet fogja használni a modul háttereként. A háttérkép eltávolításához egyszerűen távolítsa el az URL-t a beállítások mezőből. A háttérképek a háttérszínek tetején jelennek meg, ami azt jelenti, hogy a háttérszín nem lesz látható háttérkép alkalmazása esetén.

Admin címke

Ez megváltoztatja a konstruktor modul címkéjét az egyszerű azonosítás érdekében. Amikor a WireFrame nézetet használja a Visual Builder alkalmazásban, ezek a címkék a Divi Builder felület modulblokkjában jelennek meg.

A Person modul tervezési lehetőségei

A Tervezés lapon megtalálja a modul összes stíluslehetőségét, például a betűtípusokat, a színeket, a méretezést és a térközt. Ezen a lapon módosíthatja a modul megjelenését. Minden Divi modulnak hosszú a tervezési beállítások listája, amelyek segítségével bármit megváltoztathat.

Ikon színe

Ez az opció szabályozza az egyes személyek profiljában megjelenő közösségi média ikonok színét. Alapértelmezés szerint ezek az ikonok szürke színűek, ezért ezt a beállítást használva megváltoztathatja ezt a színt.

Ikon színe az egérrel

Megváltoztathatja az egérmutató színét a közösségi média ikonjai számára is. Válassza ki a kívánt színt a színválasztó segítségével ebben a beállításban.

Szöveg színe

Itt választhatja ki a szövege értékét. Ha sötét háttérrel dolgozik, a szövegnek be kell kapcsolnia. Ha világos háttérrel dolgozik, akkor a szövegének sötétnek kell lennie.

Fejléc betűtípusa

A fejléc szövegének betűtípusát úgy módosíthatja, hogy a legördülő menüből kiválasztja a kívánt betűtípust. A Divi több tucat nagyszerű betűtípussal rendelkezik, amelyeket a Google Fonts fejleszt. Alapértelmezés szerint Divi az Open Sans betűtípust használja az oldal összes szövegéhez. A szöveg stílusát testreszabhatja félkövér, dőlt, nagybetűs és aláhúzási lehetőségek használatával is.

Fejléc betűmérete

Itt állíthatja be a fejléc szövegének méretét. A tartomány csúszkáját húzva növelheti vagy csökkentheti a szöveg méretét, vagy közvetlenül beírhatja a kívánt szövegméret értékét a csúszka jobb oldalán található beviteli mezőbe. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának megváltoztatásához.

Fejléc szövegének színe

Alapértelmezés szerint a Divi összes szövegszíne fehér vagy sötétszürke. Ha meg szeretné változtatni a fejléc szövegének színét, válassza ki a kívánt színt a színválasztóból ezzel az opcióval.

Fejléc betűköz

A betűköz befolyásolja az egyes betűk közötti helyet. Ha meg szeretné növelni a fejlécszöveg egyes betűi közötti teret, használja a tartomány csúszkáját a szóköz beállításához, vagy írja be a kívánt távolságméretet a csúszka jobb oldalán található beviteli mezőbe. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának módosításához.

Fejléc magassága

A sor magassága befolyásolja a fejlécszöveg egyes sorai közötti teret. Ha növelni szeretné az egyes sorok közötti teret, a tartomány csúszkájával állítsa be a teret, vagy írja be a kívánt távolságméretet a beviteli mező a kurzor jobb oldalán. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának megváltoztatásához.

A test betűtípusa

A legördülő menüből kiválaszthatja a kívánt betűtípust. A Divi több tucat nagyszerű betűtípussal rendelkezik, amelyeket a Google Fonts szolgáltat. Alapértelmezés szerint Divi az Open Sans betűtípust használja az oldal összes szövegéhez. Testreszabhatja szövegének stílusát félkövér, dőlt, nagybetűk és aláhúzási lehetőségek használatával.

A test betűmérete

Itt állíthatja be a törzsszöveg méretét. A tartomány csúszkáját húzva növelheti vagy csökkentheti a szöveg méretét, vagy közvetlenül beírhatja a kívánt szövegméret értékét a csúszka jobb oldalán található beviteli mezőbe. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának megváltoztatásához.

A test szövegszíne

Alapértelmezés szerint a Divi összes szövegszíne fehér vagy sötétszürke. Ha meg akarja változtatni a szöveg színét, válassza ki a kívánt színt a színválasztóból ezzel az opcióval.

A testek betűinek távolsága

A betűköz befolyásolja az egyes betűk közötti helyet. Ha meg akarja növelni a szöveg egyes betűi közötti teret, használja a tartomány csúszkáját a szóköz beállításához, vagy írja be a kívánt távolságméretet a csúszka jobb oldalán található beviteli mezőbe. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának megváltoztatásához.

A testvonal magassága

A vonalvastagság befolyásolja a szöveg egyes sorai közötti távolságot a testben a kurzortól jobbra található. A beviteli mezők különböző mértékegységeket támogatnak, ami azt jelenti, hogy a méretértékétől függően "px" vagy "em" értéket adhat meg az egység típusának megváltoztatásához.

Használja a határt

Ennek az opciónak az engedélyezésével szegély kerül a modul köré. Ez a határ testreszabható a következő feltételes paraméterekkel.

A határ színe

Ez az opció befolyásolja a szegély színét. Válasszon ki egy egyéni színt a színválasztóból, hogy alkalmazza a határára.

A határ szélessége

Alapértelmezés szerint a szegélyek 1 pixel szélesek. Növelheti ezt az értéket a tartomány csúszkájának húzásával vagy egy egyéni érték megadásával a csúszka jobb oldalán található beviteli mezőben. Támogatott egyedi mértékegységek, ami azt jelenti, hogy megváltoztathatja az alapértelmezett egységet "px" értékről valami másra, például em, vh, vw stb.

Határtípus

A szegélyek nyolc különböző stílust támogatnak: szilárd, pontozott, pöttyös, dupla, barázda, csúcs, átfedés és kezdet. Válassza ki a kívánt stílust a legördülő menüből, hogy alkalmazza azt a szegélyén.

Egyéni margó

A margó a modul külső részén, a modul és a következő elem felett, alatt, illetve annak bal és jobb oldalán hozzáadott hely. Hozzáadhat egyedi margóértékeket a modul négy oldalához. Az egyéni margó eltávolításához távolítsa el a hozzáadott értéket a beviteli mezőből. Alapértelmezés szerint ezek az értékek pixelben vannak megadva, de a beviteli mezőkbe egyéni mértékegységeket adhat meg.

Egyéni párnázás

A kitöltés a modul belsejében, a modul éle és a belső elemei között hozzáadott hely. Hozzáadhat egyedi kitöltési értékeket a modul négy oldalához. Az egyéni margó eltávolításához távolítsa el a hozzáadott értéket a beviteli mezőből. Alapértelmezés szerint ezek az értékek pixelben vannak megadva, de a beviteli mezőkbe egyéni mértékegységeket adhat meg.

A Személy modul speciális lehetőségei

A Haladó lapon olyan lehetőségeket talál, amelyeket a tapasztaltabb webtervezők hasznosnak találhatnak, például egyéni CSS és HTML attribútumokat. Itt alkalmazhat egyedi CSS-t a modul számos elemére. Alkalmazhat egyedi CSS osztályokat és azonosítókat is a modulra, amelyek felhasználásával testreszabhatja a modult a gyermek téma style.css fájljában.

CSS azonosító

Adjon meg egy opcionális CSS azonosítót, amelyet ehhez a modulhoz használ. Az azonosító felhasználható egyedi CSS-stílus létrehozására vagy az oldal egyes szakaszaira történő hivatkozásokra.

CSS osztály

Adja meg az ehhez a modulhoz használandó opcionális CSS-osztályokat. Egy CSS-osztály használható egyéni CSS-stílus létrehozására. Több osztályt is felvehet, szóközzel elválasztva. Ezek az osztályok használhatók a Divi gyermektémában vagy az oldalához vagy webhelyéhez hozzáadott egyéni CSS-stíluslapban. weboldal a Divi témabeállítások vagy a Divi Builder oldalbeállítások használatával.

Egyéni CSS

Az egyedi CSS alkalmazható a modulra és a modul bármely belső elemére is. Az Egyéni CSS részben talál egy szövegmezőt, ahol egyedi CSS stíluslapokat adhat hozzá minden elemhez. Az ezekben a beállításokban található CSS ​​bejegyzések már stíluscímkékbe vannak csomagolva. Tehát csak pontosvesszővel elválasztva adja meg a CSS-szabályokat.

Élénkség

Alapértelmezés szerint a képek animálódnak az oldal görgetése közben. Itt kiválaszthatja az animáció irányát, vagy kikapcsolhatja.

láthatóság

Ez az opció lehetővé teszi azoknak az eszközöknek a vezérlését, amelyeken a modul megjelenik. Választhatja a modul deaktiválását táblagépeken, okostelefonokon vagy asztali számítógépeken egyenként. Ez akkor hasznos, ha különböző modokat szeretne használni különböző eszközökön, vagy ha le akarja egyszerűsíteni a mobil tervezését azáltal, hogy bizonyos elemeket eltávolít az oldalról.

[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”]DIVI TÉMA LETÖLTÉSE [/vcex_button][/vc_column][vc_colum /1″][vcex_button url=”https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=2&url=23065&tid40632=tutorials” target=”blank” layout=”expanded” align=”center” font_family = ”Raleway” font_weight=”1″ style=”flat” custom_background=”#c700e” custom_hover_background=”#4226d8f” custom_color=”#ffffff” custom_hover_color=”#ffffff” icon_right=”fa fa-download”]LETÖLTÉS TEMPLATES DIVI[/vcex_button][/vc_column][/vc_row]

Egyéb Divi oktatóanyagok

• 5 weboldalak éttermi felhasználásra Divi téma
• Hogyan lehet szöveget hozzáadni a Divi WooCommerce termékhez?
• Hogyan változtathatja meg a menü színét a Divi oldalak között
• Hogyan lehet személyre szabni egy blog rácsát a Divi-vel
• Hogyan kell használni a szerepe Divi szerkesztő WordPress
• Hogyan készítsünk teljes képernyős Divi csúszkát?
• Hogyan változtathatja meg a menük színét a Divi oldalak között
• Funkciók, amelyeket valószínűleg nem ismer a Divi-ről
• A Divi Builder használata a WordPress-en
• Hogyan használjuk a Divi video scrolling modult
• A Divi Builder Flip modul használatának módja
• Hogyan adhatunk hozzá egy beszámolót a Divi Builderhez
• A Divi szövegmodul használata
• Hogyan lehet létrehozni egy csúszkát a Divi-n
• A Divi felhasználói szerepkör szerkesztése
• A Divi Social Media használata
• Hogyan lehet használni az üzlet modult a WordPress Divi témában?
• A Divi oldalsáv moduljának használata
• A Divi áratábla modul használatának módja
• A Divi kiadványok címmoduljának használata
• Hogyan adhatunk hozzá egy Divi video modult
• A cikk navigációs moduljának használata
• A Divi keresőmodul használata
• A Divi pénztárca moduljának használata
• A személyi modul használata a Divi Builder-en
• A pénztárca moduljának használata a Divi szűrővel
• A teljes szélességű csúszka modul használata
• A Divi Builder képmodul használata
• A Divi Builder teljes szélességű navigációs moduljának használata
• A képgaléria modul használata
• A Divi Builder teljes szélességű kártya moduljának használata
• A Divi teljes szélességű portfólió moduljának használata
• A Divi teljes szélességű fejléc moduljának használata
• A Divi számláló modul használata
• Hogyan lehet használni a Divi Builder cikkcsúszkáját?
• A Divi Email Optin modul használata