# A popup beállításai

> Animáció, nyitási esemény, egyszeri megjelenítés, Ajax-betöltés és bezárási beállítások Elementorban és a blokkszerkesztőben.

A popup működését a szerkesztőben állítod be. Elementorban a **JetPopup Beállítások** panel **Beállítások** fülén, a blokkszerkesztőben a **Jet Popup** oldalsávon. A két szerkesztő ugyanazokat a lehetőségeket adja, a felirataik kicsit eltérnek.

![A JetPopup beállítások panel az Elementorban](./kepek/elementor-beallitasok.webp)

*A JetPopup beállítások panel az Elementorban* (https://minta-bolt.hu/wp-admin/post.php?post=11&action=elementor)

A képen a **Beállítások** szekció van kinyitva: az **Animáció**, a **Megnyitási esemény**, az **Egyszeri megjelenítés** és a többi kapcsoló egymás alatt látszik.

## Általános beállítások

| Beállítás (Elementor) | Mit csinál | Alapérték |
|---|---|---|
| **Animáció** | A popup megjelenésének és eltűnésének effektje | **Áttűnés** |
| **Use custom animation duration** | Bekapcsolva megadhatod a megjelenés és az eltűnés időtartamát ezredmásodpercben (**Animation in duration (ms)**, **Animation out duration (ms)**) | Nem |
| **Megnyitási esemény** | Mikor jelenjen meg a popup (lásd lent) | **Nincs kiválasztva** |
| **On close event** | Mi történjen a popup bezárásakor | **Nincs kiválasztva** |
| **Automatically close after (sec)** | A popup ennyi másodperc után magától bezáródik | üres |
| **Disable Page Scrolling** | A popup nyitva tartása alatt az oldal nem görgethető | Nem |
| **Egyszeri megjelenítés** | A popup egy látogatónak csak egyszer jelenik meg | Nem |
| **Loading content with Ajax** | A popup tartalma csak megnyitáskor töltődik be, Ajax-kéréssel | Nem |
| **Display Conditions** | Az **Edit** gomb a megjelenési feltételek ablakára visz (lásd [Megjelenési feltételek](https://hub.hellowp.io/hu/plugins/jet-popup/megjelenesi-feltetelek/)) | nincs feltétel |

Az **Animáció** választható értékei: **Nincs**, **Áttűnés**, **Nagyítás**, **Kicsinyítés**, **Forgatás**, **Felfelé mozgatás**, **Vízszintes tükrözés**, **Függőleges tükrözés**, **Beugrás**, **Kiugrás**, **Becsúszás felfelé**, **Becsúszás jobbról**, **Becsúszás lefelé**, **Becsúszás balról**.

### Megnyitási esemény

A **Megnyitási esemény** választja ki, mikor nyílik meg a popup. Egyes értékeknél további mezők jelennek meg.

| Érték | Mikor nyílik meg | További mező |
|---|---|---|
| **Nincs kiválasztva** | Magától soha: csak egy elemhez csatolva ([Indítók](https://hub.hellowp.io/hu/plugins/jet-popup/inditok/)) nyílik meg | nincs |
| **Oldal betöltésekor** | Amikor a látogató megnyitja az oldalt | **Megnyitási késleltetés** (másodperc) |
| **Inaktivitás utáni idő (mp)** | Ha a látogató egy ideig nem csinál semmit az oldalon | **Felhasználói inaktivitás ideje** (másodperc) |
| **Oldal görgetése (%)** | Ha a látogató az oldal megadott százalékáig legörgetett | **Az oldal görgetésének előrehaladása (%)** |
| **Kilépési szándék** | Amikor a látogató el akarja hagyni az oldalt | nincs |
| **Megadott dátumon** | A megadott időponttól | **Megnyitás dátuma** |
| **On Time** | Minden nap a megadott időszakban | **Start Time**, **End Time** |
| **On Date and Time** | A megadott kezdő és záró időpont között | **Start Date and Time**, **End Date and Time** |
| **Weekly Schedule ( Days & Time )** | A kiválasztott napokon, a megadott időszakban | **Days of Week** (hétfőtől vasárnapig), **Start Time**, **End Time** |
| **Egyéni szelektorra kattintás** | Egy megadott elemre kattintva | **Egyéni szelektor** |

A dátumok az oldal időzónájában értendők (a képen **Europe/Budapest**, a mező alatt ki is írja).

![Megadott dátumon nyíló popup beállítása](./kepek/elementor-nyitasi-esemeny.webp)

*Megadott dátumon nyíló popup beállítása* (https://minta-bolt.hu/wp-admin/post.php?post=11&action=elementor)

A képen a **Megadott dátumon** érték van kiválasztva, alatta megjelent a **Megnyitás dátuma** mező.

#### Egyéni szelektor

Az **Egyéni szelektorra kattintás** értéknél a **Egyéni szelektor** mezőbe egy CSS-szelektort írsz, és a popup erre az elemre kattintva nyílik meg.

- Osztály esetén a név elé pontot tegyél, például `.nyisd-meg`.
- Azonosító (ID) esetén a név elé kettőskeresztet, például `#nyisd-meg`.

A szelektort a weboldalon az F12 billentyűvel megnyitható böngészős fejlesztői eszközökben, az elem kódjában találod meg.
### Bezárási esemény

Az **On close event** két értéke:

- **Scroll to top**: a popup bezárása után az oldal az elejére görög.
- **Scroll to anchor**: bezárás után az oldal a megadott horgonyra görög. Az **Anchor ID** mezőbe a horgony azonosítóját írd.

### Egyszeri megjelenítés

Az **Egyszeri megjelenítés** bekapcsolva a popup egy látogatónak csak egyszer jelenik meg. A **Repeat showing popup in** listából megadhatod, mennyi idő után jelenjen meg újra: **Nincs**, **Perc**, **10 perc**, **30 perc**, **1 óra**, **3 óra**, **6 óra**, **12 óra**, **Nap**, **3 nap**, **Hét** vagy **Hónap**.

### Ajax-betöltés

A **Loading content with Ajax** bekapcsolva a popup tartalma nem az oldallal együtt, hanem a popup megnyitásakor töltődik be, ami gyorsítja az oldal betöltését. Alatta megjelenik a **Force Loading** kapcsoló: bekapcsolva a tartalom a popup minden megnyitásakor újra betöltődik.

## A blokkszerkesztő beállításai

A blokkszerkesztő oldalsávjának mezői ugyanezeket teszik. A feliratok egy része angol nagybetűs szöveg:

| Felirat | Megfelel |
|---|---|
| **ANIMATION** | Animáció |
| **OPEN EVENT** | Megnyitási esemény, ugyanazokkal az értékekkel és kiegészítő mezőkkel (**OPEN DELAY(S)**, **USER INACTIVITY TIME(S)**, **PAGE SCROLL PROGRESS(%)**, **OPEN DATE**, **START TIME**, **END TIME**, **CUSTOM SELECTOR** és a kétidőpontos változatok) |
| **PREVENT PAGE SCROLLING** | Disable Page Scrolling |
| **SHOW ONCE** | Egyszeri megjelenítés |
| **LOADING CONTENT WITH AJAX** | Loading content with Ajax |
| **CLOSE POPUP AFTER FORM SUBMIT** | A popup űrlap sikeres elküldése után bezárul (Elementor-űrlapok és JetFormBuilder esetén) |
| **USE CLOSE BUTTON** | Bezárógomb megjelenítése (alapértelmezetten be van kapcsolva) |
| **SVG ICON** | A bezárógomb ikonja (**Select Icon**) |
| **USE OVERLAY** | A popup mögötti képernyő elsötétítése |
| **CLOSE ON OVERLAY CLICK** | A popup bezárul, ha a sötét háttérre kattintasz |
| **DISPLAY CONDITIONS** | Az **Edit Conditions** gomb a megjelenési feltételek ablakára visz |

![A blokkszerkesztő JetPopup oldalsávja](./kepek/gutenberg-popup-beallitasok.webp)

*A blokkszerkesztő JetPopup oldalsávja* (https://minta-bolt.hu/wp-admin/post.php?post=28&action=edit)

A képen a blokkszerkesztő oldalsávja látszik: felül az animáció és a nyitási esemény, alatta a kapcsolók.

## Közzététel után

A beállítások a **Közzététel** (Elementor), illetve a **Mentés** (blokkszerkesztő) gombbal mentődnek. Próbáld ki a popupot a weboldalon: nyisd meg azt az oldalt, ahol a feltételek szerint megjelenik, és hajtsd végre a nyitási eseményt.