# Indítók: popup csatolása egy elemhez

> Popup megnyitása egy widgetre vagy blokkra kattintással, rámutatással vagy odagörgetéssel Elementorban és a blokkszerkesztőben.

A popupot egy oldalon lévő elemhez is hozzákötheted: így akkor nyílik meg, amikor a látogató az elemmel valamit csinál (rákattint, fölé mutat, odagörget). Ehhez a popup **Megnyitási esemény** értéke maradhat **Nincs kiválasztva**.

## Elementor

1. Nyisd meg az oldalt az Elementor szerkesztőjében.
2. Kattints arra a widgetre, amelyhez a popupot kötni szeretnéd (például egy **Gomb** widgetre).
3. A widget panelén nyisd meg a **Haladó** fület, és azon belül a **JetPopup** szekciót.
4. A **Csatolt felugró ablak** listából válaszd ki a korábban elkészített popupot. A **Felugró ablak szerkesztése** gombbal közvetlenül megnyithatod a popup szerkesztőjét.
5. Az **Indítási típus** listában válaszd ki, mikor nyíljon meg.
6. Kattints a **Közzététel** (vagy **Frissítés**) gombra.

![A widget JetPopup szekciója az Elementorban](./kepek/widget-inditas.webp)

*A widget JetPopup szekciója az Elementorban* (https://minta-bolt.hu/wp-admin/post.php?post=12&action=elementor)

A képen a **Gomb** widget **Haladó** fülén a **JetPopup** szekció látszik: a kiválasztott popup, az **Indítási típus** a **Kattintás widgetre** értéken, alatta az **Elementor Loop Dynamic Popup** kapcsoló.

Az **Indítási típus** értékei:

| Érték | Mikor nyílik meg a popup |
|---|---|
| **Nincs** | Soha, a csatolás nem működik |
| **Kattintás gombra** | Ha a látogató a widget belső gombjára kattint (olyan widgeteknél, amelyekben van gomb, például a JetElements Posts, Animated Box vagy Pricing Table widgetjeinél) |
| **Kattintás widgetre** | Ha a látogató a widgetre kattint |
| **Kattintás egyéni szelektorra** | Ha a látogató a megadott szelektorú elemre kattint |
| **Rámutatás** | Ha a látogató az egérrel a widget fölé mutat |
| **Görgetés a widgethez** | Ha a látogató odagörget a widget helyéhez |

A **Kattintás egyéni szelektorra** értéknél megjelenik egy mező a szelektornak. Osztály előtt pont, azonosító előtt kettőskereszt áll (például `.nyisd-meg` vagy `#nyisd-meg`). Hogyan találod meg a szelektort: nyisd meg a weboldalt, nyomd meg az F12 billentyűt, és másold ki a kívánt elem osztályát vagy azonosítóját a kódból.

Az **Elementor Loop Dynamic Popup** kapcsolót akkor kapcsold be, ha a popupot egy Elementor Loop elemből nyitod meg. Ilyenkor a widgeten az Elementor gyorsítótárát ki kell kapcsolni, hogy a dinamikus popup jól működjön.

Konténer esetén egy további érték is megjelenhet: a **Click on Container** (kattintás a konténerre), amellyel az egész konténer, például egy listaelem kattinthatóvá válik.

## Blokkszerkesztő

1. Nyisd meg az oldalt a blokkszerkesztőben, és kattints arra a blokkra, amelyhez a popupot kötnéd.
2. A **Blokk** oldalsávon nyisd ki a **Haladó** szekciót, és görgess az aljára.
3. Az **ATTACHED POPUP** listában válaszd ki a popupot.
4. A **TRIGGER TYPE** listában válaszd ki, mikor nyíljon meg.
5. Kattints a **Mentés** gombra.

![A gomb blokk popup-csatolása](./kepek/gutenberg-blokk-inditas.webp)

*A gomb blokk popup-csatolása* (https://minta-bolt.hu/wp-admin/post.php?post=30&action=edit)

A képen a **Gomb** blokk **Haladó** szekciójának alján az **ATTACHED POPUP** és a **TRIGGER TYPE** mező látszik; a trigger típus itt **Click**.

A **TRIGGER TYPE** értékei: **Nincs**, **Click** (kattintás a blokkra), **Egyéni szelektorra kattintás**, **Rámutatás** és **Scroll To Block** (odagörgetés a blokkhoz). Az egyéni szelektorra ugyanaz a szabály vonatkozik: osztály előtt pont, azonosító előtt kettőskereszt.

## Más megnyitási események

Ha a popup nem egy elemhez kötődik, hanem magától nyílik meg (oldal betöltésekor, inaktivitás után, görgetésre, kilépési szándékkor, megadott dátumon vagy időszakban), a **Megnyitási esemény** értékeit a [A popup beállításai](https://hub.hellowp.io/hu/plugins/jet-popup/popup-beallitasok/) fejezet írja le, az **Egyszeri megjelenítéssel** és az ismétlési idővel együtt.

WooCommerce-es példák (termék gyorsnézet, vásárlási értesítés): [WooCommerce-popupok](https://hub.hellowp.io/hu/plugins/jet-popup/inditok-woocommerce-popupok/).

## Kipróbálás

Nyisd meg a weboldalon azt az oldalt, ahol a popupot csatoltad, és hajtsd végre az indító műveletet. A popup megnyílik, a mögötte lévő oldal elhomályosul.