Haladó tipográfia widget: áttekintés és Többes kiválasztás mód

A Haladó tipográfia widget (angolul Advanced Typography) olyan szöveghatásokat ad az Elementor szerkesztőbe, amelyekhez máskülönben egyéni CSS kellene: körvonalas, körbe hajlított, görgetésre mozgó vagy képpel kitöltött szöveget. A hatások kapcsolókkal állíthatók, kódot nem kell írnod.

A widget a The Plus Addons for Elementor Pro része. Az ingyenes bővítményben a widget zárolt ikonnal látszik az Elementor panelen, és ha a Pro bővítményt kikapcsolod, a widget eltűnik az oldalról. Szükséged van az Elementor (ingyenes) bővítményre is. Az egyes hatások részletes leírása a Haladó tipográfia: szöveghatások és a Haladó tipográfia: görgetés és egérmozgás fejezetben van.

A widget bekapcsolása

1. A WordPress vezérlőpultján nyisd meg a The Plus Addons → Widgets oldalt.
2. Keress rá a Advanced Typography névre, és kapcsold be a kapcsolóját.
3. Nyiss meg egy oldalt Elementorral, és húzd a widgetet az oldalra. A panelen Haladó tipográfia néven találod.

Normál vagy Többes kiválasztás

A Tartalom fül Haladó tipográfia szakaszában a Válaszd ki az opciót mező dönti el, hogyan épül fel a szöveg:

Érték	Mit jelent
Normál (alapérték)	Egy szöveg, egy hatáskészlet. Minden alább felsorolt szakasz elérhető.
Többes kiválasztás	A Szöveglista elemei egymás mellett jelennek meg, mindegyiknek saját szövege, hatásai és stílusa van.

https://minta-bolt.hu/wp-admin/post.php?post=65&action=elementor

A képen a Normál mód látszik: fent a szöveg, a címke és az igazítás, alatta a hatásszakaszok zárt listája.

Normál módban a Szöveg mezőbe írd a szöveget, a Címke mezőben válaszd ki a HTML-elemet (H1-től H6-ig, div, p vagy span; alapértelmezés: span), az Igazítás pedig eszközönként állítható (alapértelmezés: középre).

https://minta-bolt.hu/tp-tipo-normal/

A kép a Körvonal/kitöltés opciói szakasz bekapcsolt eredményét mutatja: a betűknek csak a körvonala színes.

Tartalmi szakaszok (Normál mód)

Minden hatásszakaszban van egy Engedélyezés/Letiltás kapcsoló. A hatás csak bekapcsolva él.

Szakasz	Mit csinál
Szövegirány	Függőleges szöveg, álló betűk, szövegirány és CSS-transzformációk. A forgatási pontot itt a Transzformáció origója adja.
Körvonal/kitöltés opciói	Körvonalas szöveg. A színek és a vastagság a Stílus fül Körvonal/kitöltés stílusa szakaszában is állíthatók.
Kör alakú szöveg	A szöveget körbe hajlítja.
Háttéren alapuló keverési mód	A szöveget összekeveri a mögötte lévő háttérrel (CSS keverési módok).
Kivágott szöveg	A betűket színnel vagy képpel tölti ki.
Kép felfedése rámutatáskor	Képet mutat, ha a látogató a szöveg fölé viszi az egeret.
Futószöveg	Mozgó, görgetett szöveg.
Speciális beállítások	A szöveg linkje.

A hatások részletes leírását és a beállításaikat a hatások fejezete tartalmazza.

Stílus fül

A Stílus fülön ezek a szakaszok vannak:

• Haladó tipográfia: Padding, Tipográfia, és a Normál meg Rámutatás füleken a Színtípus (klasszikus vagy színátmenet), a Szövegárnyék és a CSS-szűrők. Többes kiválasztás módban ezek minden elemre vonatkoznak.
• Körvonal/kitöltés stílusa: csak akkor látszik, ha a Körvonal/kitöltés opciói be van kapcsolva.
• Folyamatos animáció (csak Normál módban): pulzálás, lebegtetés, dobálás vagy forgás, kérésre csak rámutatáskor.
• Haladó aláhúzási opciók (csak Normál módban): klasszikus vagy átfedéses aláhúzás.

A Haladó fülön az Elementor saját beállításai mellett a The Plus Addons extrái is megjelennek, például a Tooltip, a Folyamatos animáció és a Megjelenítési feltétel.

Több stílus egy szövegben (Többes kiválasztás mód)

Ez a mód akkor jó, ha egy cím egyik szava körvonalas, a másik márkaszínű, a harmadiknak pedig saját hatása van.

1. Add hozzá a Haladó tipográfia widgetet, és a Válaszd ki az opciót mezőt állítsd Többes kiválasztás értékre.
2. A Szöveglista két elemmel indul. Írd az első elembe a szöveg első részét, a másodikba a következőt. További részekhez használd az Elem hozzáadása gombot. Ha a következő szónak nem szabad az előzőhöz tapadnia, tegyél szóközt az elem végére.
3. Nyiss meg egy elemet, és állítsd be a Szöveg és szükség esetén az URL/link mezőt.
4. Kapcsold be az elemhez tartozó hatásokat, például a Körvonal/kitöltés opciói kapcsolót.
5. Az elem Tipográfia, Normál és Rámutatás füleinél állítsd be a stílusát.
6. Ismételd meg a többi elemmel, végül állítsd be az Igazítás mezőt.

https://minta-bolt.hu/wp-admin/post.php?post=72&action=elementor

A képen a Szöveglista három elemből áll, amelyek együtt egyetlen címet adnak.

https://minta-bolt.hu/wp-admin/post.php?post=72&action=elementor

A megnyitott elemnél látod a hatáskapcsolókat (Körvonal/kitöltés opciói, Háttéren alapuló keverési mód, Kivágott szöveg, Kép felfedése rámutatáskor, Futószöveg, Mágikus görgetés, Parallaxis egérmozgással, Folyamatos animáció) és a Haladó aláhúzási opciók mezőt.

Az oldalon az elemek így jelennek meg:

https://minta-bolt.hu/tp-tipo-tobbszoros/

A képen a három elem egy sorban, egy szövegként látszik, mindegyik a saját stílusával.

Elembeállítások

Beállítás	Mit csinál
Szöveg, URL/link	Az elem szövege és az opcionális link.
Körvonal/kitöltés opciói	Körvonalas szöveg a Vonalvastagság és a Normál/Rámutatás színekkel.
Háttéren alapuló keverési mód	Az elemet összekeveri a háttérrel.
Kivágott szöveg	Színnel vagy képpel tölti ki a betűket.
Kép felfedése rámutatáskor	Rámutatáskor képet mutat.
Futószöveg	Mozgó szöveg.
Mágikus görgetés	Az elemet mozgatja görgetés közben (csak Többes kiválasztás módban).
Parallaxis egérmozgással	Az elemet mozgatja az egérrel (csak Többes kiválasztás módban).
Folyamatos animáció	Pulzálás, lebegtetés vagy dobálás, kérésre csak rámutatáskor.
Haladó aláhúzási opciók	Klasszikus vagy átfedéses aláhúzás.
Tipográfia fül	Tipográfia, Padding, Normál transzformáció, Transzformáció rámutatáskor és Haladó stílus (Szövegszélesség, Vízszintes igazítás, Függőleges illesztés).
Normál / Rámutatás fül	Szín (klasszikus vagy színátmenet), Szövegárnyék, CSS-szűrők.

Hogyan működik

• Az elemek sorban, egymás után jelennek meg ugyanabban a szövegben.
• A Stílus → Haladó tipográfia szakasz beállításai minden elemre érvényesek, az elem saját fülei csak az adott elemre.
• A Mágikus görgetés és a Parallaxis egérmozgással csak Többes kiválasztás módban érhető el.

Korlátozások

• Többes kiválasztás módban nincs Címke beállítás, ezért a szöveg nem lehet H1 vagy H2 elem.
• A Szövegirány, a Kör alakú szöveg és a Forgó animáció csak Normál módban érhető el.