A Fullwidth Wallet modul a Divi téma, ugyanúgy működik, mint a normál Portfolio modul, kivéve, hogy gyönyörű Fullwdth módban jeleníti meg a projektet. Néhány egyedi új konfigurációval is rendelkezik: Grid és Carousel. A modul a legutóbbi projektek listájának megjelenítésével működik, és olyan tervezők és művészek is használhatják, akik szeretnék megjeleníteni egy galériát legfrissebb munkáikból.

teljes szélességű porfolio modul divi.png

Portfólió teljes szélességű moduljának felvétele az oldalra

Mielőtt egy teljes portfólió 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.

divi builder

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. Van néhány remek oktatóanyagunk a Divi vonal- és szakaszelemeinek használatáról.

szűrhető port.png

Keresse meg a szűrhető pénztárca 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 „szűrhető portfólió” szót is, majd az „Enter” gombra kattintva automatikusan megtalálja és hozzáadja a szűrhető portfólió modult. A modul hozzáadása után a modul opcióinak listája fogadja. Ezek az opciók három fő csoportra vannak felosztva: Tartalom , Fogamzás et fejlett.

Példa felhasználási esetre: Szűrhető portfóliómodul hozzáadása egy portfólióoldalhoz

Ebben a példában megmutatom, hogyan kell egy portfóliót bemutatni egy portfólióoldalon, amely az oldal teljes szélességét lefedi.

portfólió egy egész oldalon divi.jpg

Kezdjük.

Használja a vizuális készítőt egy Teljes szélesség szakasz hozzáadásához az oldalfejléc alá. Ezután adjon hozzá egy szűrhető portfólió modult.

adj hozzá egy szűrhető portfoliót divi.jpg

Frissítse a szűrhető portfólió beállításait az alábbiak szerint:

Tartalom opciók

Üzenetek száma: 8 Megjelenítés: Nem

Tervezési lehetőségek

Elrendezés: Rács Zoom ikon színe: # 000000 Hover overlay szín: #ffffff Cím betűtípus: Alapértelmezett, félkövér, Nagybetűk címe Betűméret: 14px Cím betűköz: 1px Meta betűméret: 12px Meta távolság betűk: 1px

szűrhető portfolió modul divi.png

Ez minden!

Portfólió modul tartalma

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.

szűrhető portfólió modul divi content section.png

Portfólió címe

Írja be a portfólió felett megjelenő címet, vagy hagyja üresen, hogy ne használjon címet.

Tartalmazza a kategóriákat

Válassza ki a megjeleníteni kívánt kategóriákat. A nem kiválasztott kategóriákból származó projektek nem jelennek meg a projektek listájában.

Üzenetek száma

A megjelenített projektek számának ellenőrzése Hagyja üresen, vagy használja a 0 billentyűt az összeg korlátozásához.

Cím megjelenítése

Válassza ki, hogy az egyes projektek címe megjelenjen-e, ha az egérmutatót a projekt elem fölé viszi.

Megjeleníti a dátumot

Válassza ki, hogy az egyes projektek közzétételi dátuma megjelenjen-e, ha az egérmutatót a projekt elem fölé viszi.

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.

Rendszergazda 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.

Teljes szélességű pénztárca tervezési lehetőségek

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.

design modul divi.png

Diszpozíció

Válassza ki a használni kívánt elrendezést. A „Rács” az összes elemet több oszlopos, többsoros elrendezésben jeleníti meg. A körhinta az elemeit egyetlen csempézett képsorban jeleníti meg, amelyek csúsztatva további elemeket jelenítenek meg a listában.

Zoom színes ikon

Amikor a portfólió modulban egy elem fölé viszi az egérmutatót, megjelenik egy átfedés ikon. Az ebben az ikonban használt színt a beállítás színválasztójával állíthatja be.

Hover Color Overlay

Amikor a portfólió modulban egy elem fölé viszi az egérmutatót, a kép tetején, valamint a portfólió címe szövege és ikonja alatt megjelenik egy fedőszín. Alapértelmezés szerint félig átlátszó fehér színt használnak. Ha más színt szeretne használni, akkor a színválasztó segítségével állíthatja be a színt ebben a beállításban

Mutasson az ikonválasztóra

Itt kiválaszthat egy egyéni ikont, amelyet megjelenít, amikor a látogató a modul portfólió elemei fölé viszi az egeret.

Szöveg színe

Itt kiválaszthatja, hogy a szöveg világos vagy sötét legyen.

opciótervezés szűrhető portfolió modul divi.png

Cím betűtípus

A cím 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 szolgáltat. 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.

A cím betűmérete

Itt állíthatja be a cím 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" karaktereket adhat meg az egység típusának megváltoztatásához.

A cím 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 cím 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.

Címcímek távolsága

A betűköz befolyásolja az egyes betűk közötti helyet. Ha meg szeretné növelni a cím szövegében az egyes betűk 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érköz mé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" karaktereket adhat meg az egység típusának megváltoztatásához.

A címsor magassága

A vonalvastagság befolyásolja a cím szövegének minden sora közötti teret. Ha növelni szeretné az egyes sorok 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érköz méretet a beviteli mezőbe 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.

szűrhető portfólió divi module section metadonnee.png

Meta betűtípus

A meta szöveg 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 szolgáltat. 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.

Metas betűméret

Itt állíthatja be a metaszö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" karaktereket adhat meg az egység típusának megváltoztatásához.

Meta szöveg színe

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

Meta levél távolság

A betűköz befolyásolja az egyes betűk közötti helyet. Ha meg akarja növelni a metaszö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" karaktereket adhat meg az egység típusának megváltoztatásához.

Meta vonalmagasság

A sormagasság befolyásolja a metaszöveg egyes sorai közötti teret. Ha növelni kívánja 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őbe 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" karaktereket 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.

Border Stílus

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.

Speciális portfólióbeállítások Teljes szélesség

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.

divi szűrhető portfolió modul forward.png szakasz

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.

Automata körhinta

Ha a körhinta elrendezés opciót választja, és azt szeretné, hogy a körhinta automatikusan csúszkáljon anélkül, hogy a látogatónak a következő gombra kellene kattintania, engedélyezze ezt az opciót, és ha szükséges, állítsa be az alábbi centrifugálási sebességet.

Automatikus körhinta sebesség

Itt jelezheti a körhinta forgási sebességét, ha fent be van kapcsolva az "Automatikus körhinta forgása" opció. Minél nagyobb a szám, annál hosszabb a szünet az egyes forgatások között. (Pl. 1000 = 1 mp)

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 bizonyos elemek eltávolításával 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