Eszköztipp: szöveges és képes súgóbuborék bármely elemhez

Az eszköztipp egy kis felugró buborék, amely akkor nyílik, ha a látogató az elem fölé viszi az egeret (vagy rákattint). Magyarázatot, árjegyzetet vagy termékelőnézetet tehetsz bele anélkül, hogy helyet foglalna az oldalon. Az Eszköztipp kiterjesztés minden Elementor widgethez ad egy Eszköztipp szakaszt a Haladó fülön, az Elementor saját widgetjeihez is (például a Címsorhoz).

Előkészületek

• A kiterjesztés a bővítmény teljes (Pro) változatában érhető el. Az ingyenes bővítménnyel az oldalba semmilyen eszköztipp-kód nem kerül.
• Kapcsold be a The Plus Addons → Extensions oldalon a Tooltip kapcsolót. A kiterjesztések között találod (keresd a nevét), a widgetek között nem.
• Más nem kell hozzá: nincs külön bővítmény vagy bejegyzéstípus.
• A buborék csak a nyilvános oldalon jelenik meg, a szerkesztő vásznán nem.

Az eszköztipp bekapcsolása

1. Jelöld ki a widgetet.
2. Nyisd meg a Haladó → Eszköztipp szakaszt.
3. Állítsd az Eszköztipp kapcsolót Igen állásba. A szakasz többi része csak ezután jelenik meg.

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

A képen a Tartalom fül látszik a Szöveges tartalom típussal: Leírás mező, Szöveg igazítása, Tipográfia és Szöveg színe.

A Tartalom fül

Beállítás	Mit csinál	Alapérték
Tartalomtípus	A szerkesztőt választja. Szöveges tartalom: egyszerű szövegmező. WYSIWYG-szerkesztő: teljes WordPress-szerkesztő, amellyel képet, hivatkozást és formázást tehetsz a buborékba.	Szöveges tartalom
Leírás	A buborék szövege. Csak Szöveges tartalom esetén látszik.	Helyőrző szöveg
Eszköztipp tartalma	A formázott szövegű buborékszöveg. Csak WYSIWYG-szerkesztő esetén látszik.	Helyőrző szöveg
Szöveg igazítása	A szöveg igazítása a buborékban. Csak szöveges tartalomnál.	Középre
Tipográfia	A buborékszöveg betűbeállításai.	A téma alapértelmezése
Szöveg színe	A buborékszöveg színe.	Nincs beállítva

A Stílus fül

A Stílus fülön két előugró panel van: Buboréksúgó opciói (viselkedés és hely) és Stílusopciók (a doboz kinézete). Kattints a tollra mutató ikonra a címke mellett a megnyitásukhoz. A panelek beállításai csak akkor mentődnek, ha megnyitottad a panelt, és változtattál valamit benne.

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

Buboréksúgó opciói

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

A képen a panel összes beállítása látszik az alapértékekkel.

Beállítás	Mit csinál	Alapérték
Interaktív súgóbuborékok	Engedi, hogy a látogató az egérrel a buborékba lépjen. Ez kell, ha hivatkozás vagy gomb van a buborékban.	Bekapcsolva
Pozíció	Hol nyíljon a buborék: Bal, Jobb, Felül, Fent, a kezdő pozícióban, Fent, a záró pozícióban vagy Alul.	Felül
Sablon	A beépített színséma: Sötét, Világos vagy Áttetsző.	Sötét
Szélesség	A buborék szélessége, 50 és 700 px között vagy 0 és 100 em között.	200 px
Eltolás	Oldalirányú eltolás a horgonyponttól.	0
Távolság	A widgettől való távolság.	0
Nyilak	A buborék kis nyila: Nincs, Alapértelmezett vagy Kerek.	Alapértelmezett
Nyíl színe	A nyíl színe.	Nincs beállítva
Eseményindító	Mi nyitja a buborékot: Rámutatás vagy Kattintás.	Rámutatás
Animáció	Eltolás távolabbra, Eltolás közelebb, Áttűnés, Méretezés vagy Perspektíva.	Eltolás közelebb
Beúszás időtartama	A nyitó animáció hossza ezredmásodpercben.	250
Kiúszás időtartama	A záró animáció hossza ezredmásodpercben.	200

Stílusopciók

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

A buborék dobozát itt alakíthatod: Padding, Háttér típusa (szín vagy színátmenet), Szegély típusa, Keretsugár és Dobozárnyék (kapcsolóval).

Szöveges eszköztipp

A szöveges eszköztipp a leggyorsabb mód arra, hogy zsúfoltság nélkül magyarázz el valamit: árjegyzet, mezősúgó vagy rövid meghatározás.

1. Jelöld ki a widgetet, és nyisd meg a Haladó → Eszköztipp szakaszt.
2. Állítsd az Eszköztipp kapcsolót Igen állásba.
3. A Tartalom fülön hagyd a Tartalomtípus értékét Szöveges tartalom állapotban.
4. Írd be az üzenetet a Leírás mezőbe. Tartsd egy-két sorosra, mert a buborék alapból 200 px széles.

Ennyi elég egy működő eszköztipphez. A többi beállítás (Szöveg igazítása, Tipográfia, Szöveg színe) választható. A Szöveg igazítása akkor érdemes módosítani, ha a szöveg több soros lesz. A Szöveg színét akkor állítsd, ha az alapértelmezett szín nem olvasható jól a buborék hátterén.

A Leírás helyőrző szöveggel érkezik, cseréld le a sajátodra.

https://minta-bolt.hu/kx1-tooltip/

A képen a „Éves előfizetés” címsor fölé vitt egérrel nyílt meg a sötét buborék a szöveggel: „Évente egyszer fizetendő. Bármikor lemondható.” A buborék a widget fölött nyílik, alatta a kis nyíl mutat a widgetre.

Képes eszköztipp

Az eszköztippbe bármi kerülhet, amit a WordPress-szerkesztő elő tud állítani: kép, kép szöveggel, hivatkozás, rövid lista. Például terméket mutathat a név mellett, csapatfotót a név mellett, vagy képernyőképet a funkció mellett.

1. Készíts elő egy képet a médiatárban.
2. Jelöld ki a widgetet, és nyisd meg a Haladó → Eszköztipp szakaszt.
3. Állítsd az Eszköztipp kapcsolót Igen állásba.
4. A Tartalom fülön a Tartalomtípust állítsd WYSIWYG-szerkesztő értékre. A Leírás mező helyett az Eszköztipp tartalma szerkesztő jelenik meg.
5. Töröld a helyőrző szöveget, és a Média hozzáadása gombbal szúrd be a képet a médiatárból.

Tartsd kicsin a képet. A buborék alapból 200 px széles, a kép pedig akkora lesz, amekkorára állítod: egy teljes méretű fotó kilóg az elrendezésből, amíg meg nem adsz neki szélességet, vagy nem növeled a Szélesség értékét a Buboréksúgó opciói panelben (700 px-ig).

Ha az eszköztipp hivatkozást vagy gombot tartalmaz, hagyd bekapcsolva az Interaktív súgóbuborékok beállítást, hogy az egér be tudjon lépni a buborékba anélkül, hogy az bezárulna.

YouTube-videó az eszköztippben

Az eszköztippbe beágyazott YouTube-videó is kerülhet: a látogató az elem fölé viszi az egeret, és a buborékban lejátszhatja a videót.

1. Jelöld ki a widgetet, nyisd meg a Haladó → Eszköztipp szakaszt, és állítsd az Eszköztipp kapcsolót Igen állásba.
2. A Tartalom fülön a Tartalomtípust hagyd Szöveges tartalom értéken, vagy válaszd a WYSIWYG-szerkesztő értéket, ahogy a beágyazáshoz kényelmesebb.
3. Illeszd be a videó beágyazási kódját a Leírás mezőbe (WYSIWYG-nél az Eszköztipp tartalma szerkesztőbe, a Kód nézetben). A kódot a YouTube-on a videó Megosztás gombja, majd a Beágyazás pontja adja.
4. Nyisd meg a Stílus fület, a Buboréksúgó opciói panelt, és kapcsold be az Interaktív súgóbuborékok beállítást. Ez nélkül a videót nem tudod elindítani a buborékban.
5. Ha a videó nem fér el, emeld meg a Szélesség értékét ugyanebben a panelben (700 px-ig).
6. Mentsd az oldalt, és próbáld ki a nyilvános oldalon: a widget fölé víve megjelenik a videó a buborékban.

A buborék megjelenését (háttér, szegély, árnyék) ugyanúgy a Stílus fülön állítod, mint a szöveges eszköztippnél.

Viselkedés

• Alapértékekkel a widget fölé vitt egér sötét buborékot nyit a widget fölött. A Pozíció értéke Alul a buborékot a widget alá viszi.
• A Sablon értéke Világos fehér hátterű buborékot ad.
• Ha az Eseményindító értéke Kattintás, a rávitt egér már nem nyitja a buborékot, csak a kattintás.
• Az Eszköztipp szakasz minden Elementor widgeten megjelenik, nem csak a The Plus Addons widgetjein.

Korlátozások

• A kiterjesztés csak a bővítmény teljes (Pro) változatában érhető el, ingyenes tartalék nincs.
• A Pozíció nem kínál „Lent, a kezdő pozícióban” és „Lent, a záró pozícióban” értéket.
• Az eszköztipp alapból egérrel működik, érintőképernyőn ezért állítsd az Eseményindító értékét Kattintás értékre.
• Egyes The Plus Addons widgetek (például a Style Lists és a Cascading Image) saját Eszköztipp szakaszt tartalmaznak az egyes elemekhez. Az külön funkció, még ha a beállítások nevei egyeznek is.
• Szöveges tartalom esetén a Szöveg igazítása beállítás látszik, WYSIWYG-szerkesztő esetén nem. A buborékon belüli igazítást ilyenkor a szerkesztő saját formázásával oldd meg.
• A képes eszköztipphez nincs külön képméret-beállítás: a képet beszúráskor méretezd, vagy emeld a buborék szélességét.

Hibaelhárítás

Nincs Eszköztipp szakasz a Haladó fülön. A kiterjesztés ki van kapcsolva. Kapcsold be a The Plus Addons → Extensions oldalon a Tooltip kapcsolót, és töltsd újra a szerkesztőt. A widgetek között hiába keresed, mert nem widget.

Csak az Eszköztipp kapcsolót látom, mást nem. A szakasz többi része rejtve van, amíg az Eszköztipp nincs Igen állásban.

A nyilvános oldalon rámutatásra nem történik semmi. Ellenőrizd, hogy az Eszköztipp Igen, és hogy az Eseményindító még Rámutatás. Ha Kattintás, a rámutatás szándékosan nem csinál semmit.

A buborék megnyílik, de a stílusom nem látszik. Nyisd meg a Buboréksúgó opciói vagy a Stílusopciók panelt, és változtass meg benne egy értéket: az Elementor csak a megnyitott panel beállításait menti.

A buborékban lévő hivatkozásra nem tudok kattintani. Kapcsold be az Interaktív súgóbuborékok beállítást.

A buborék helyőrző szöveget mutat. A Leírás helyőrző szöveggel indul. Cseréld le a sajátodra.

A buborékban a kép URL-je jelenik meg szövegként. A képet szövegként illesztetted be. Használd a Média hozzáadása gombot, vagy válts a szerkesztő Kód nézetére, és ott illessz be valódi kép elemet.

Nem találom a Média hozzáadása gombot. Az Eszköztipp tartalma szerkesztőhöz tartozik, amely csak WYSIWYG-szerkesztő tartalomtípusnál jelenik meg. Szöveges tartalom esetén sima szövegmezőt kapsz.

A kép túl nagy. Adj szélességet a képnek beszúráskor, vagy emeld a Szélesség értékét a Buboréksúgó opciói panelben (700 px-ig).