# Elementor Pro űrlap: gyakorlati példák

> Felhasználó mentése, feltételek láncolása, beküldések korlátozása, Conditions Generator, SMTP, lépés kihagyása, adatok átadása másik oldalra, bejegyzés és ACF-mező frissítése, fizetési hivatkozás választása.

Ezek a példák az Elementor Pro **Űrlap** widgetére épülnek, a Dynamic Content for Elementor kiegészítéseivel.

## Felhasználó mentése az űrlapból

Az űrlap beküldésekor új felhasználót hozhatsz létre. Ehhez a **Beállítások → Általános** oldalon a **Tagság** beállításnál be kell kapcsolni a **Bárki regisztrálhat** lehetőséget.

1. Az űrlap **Küldés utáni műveletek** között add hozzá a **Mentés** műveletet.
2. A **Mezők mentése másként** választóban válaszd a felhasználó ikont.
3. A **Mentendő űrlapmezők** mezőbe vesszővel elválasztva írd azokat a mezőazonosítókat, amelyeket metaadatként el akarsz menteni. Csak a felsorolt mezők mentődnek.
4. Add meg az egyes mezők azonosítóját: **Felhasználónév**, **E-mail**, **Jelszó**.
5. Válaszd ki az új felhasználó **Szerepkör**ét.
6. Ha azt szeretnéd, hogy a regisztráló azonnal be legyen jelentkezve, kapcsold be az **Automatikus bejelentkezés** kapcsolót.

![A Mentés művelet felhasználóként mentésre állítva](./kepek/elementor-pro-form-mentes.webp)

*A Mentés művelet felhasználóként mentésre állítva* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

A **Felhasználó-regisztrációs hibaüzenet** mezővel egyedi üzenetet jeleníthetsz meg hiba esetén, a **Műveletek leállítása hiba esetén** kapcsolóval pedig megakadályozhatod, hogy a további műveletek lefussanak, ha a regisztráció nem sikerült.

Ha egy egyedi mező neve megegyezik egy WordPress-mezőével (például az e-mailével), ütközés lehet, és előfordulhat, hogy egyik mező sem mentődik el. Ilyenkor adj az egyedi mezőnek más azonosítót.

## A Hidden Label mező használata

Ha egy legördülő lista, rádiógomb vagy jelölőnégyzet több eleme ugyanazt az értéket viseli (például a Szőlő és a Narancs értéke is 200), számításnál ez nem gond, de az e-mailből és a beküldésekből nem derül ki, melyiket választotta a látogató. A **Hidden Label** mező a kiválasztott elem **feliratát** adja vissza.

1. Vedd fel a termékválasztó mezőt, és jegyezd fel az azonosítóját (például `termek`). A **Beállítások** között az elemek `felirat|érték` alakban szerepelnek.
2. Add hozzá a **Hidden Label** típusú mezőt, és a **Mező ID** mezőbe írd a termékválasztó mező azonosítóját.
3. Jegyezd fel a Hidden Label mező saját azonosítóját is (például `termek_felirat`).

![A Hidden Label mező beállításai](./kepek/elementor-pro-form-rejtett-felirat.webp)

*A Hidden Label mező beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=63&action=elementor)

A kiválasztott elem felirata ezután látszik a **Beküldések** között. Az e-mail sablonban a `[form:termek_felirat]` token (vagy a `{form:termek_felirat}` shortcode) adja vissza, így a **Dinamikus e-mail** művelettel a levélben is megjeleníthető a választott termékek listája.

## Fizetési hivatkozás választása átirányítással

Ha a fizetési szolgáltatód (például a Stripe) termékenként ad fizetési hivatkozást, az űrlap a látogató választása szerint küldheti a megfelelő hivatkozásra. A példában három termék és három hivatkozás van (`https://fizetes.example/link1`, `link2`, `link3`).

1. Vegyél fel egy **Választó** (Select) típusú mezőt `termek` azonosítóval, a termékek értéke legyen 1, 2 és 3, a felirata pedig a termék neve.
2. A **Küldés utáni műveletek** között add hozzá a **Dinamikus átirányítás** műveletet.
3. Az első tételnél a **Mező ID** legyen `termek`, a **Feltétel állapota** **Egyenlő**, a **Feltétel értéke** `1`, az **Átirányítás ide** mezőbe pedig az első fizetési hivatkozás kerüljön.
4. Az **Elem hozzáadása** gombbal vegyél fel még két tételt (vagy másold az elsőt), és cseréld ki bennük a feltétel értékét (2, 3) és a hivatkozást.

![A Dinamikus átirányítás szekció egy felvett tétellel](./kepek/elementor-pro-form-atiranyitas.webp)

*A Dinamikus átirányítás szekció egy felvett tétellel* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

Ha a látogató az 1-es értékű terméket választja, az elküldés után az első hivatkozásra kerül, és így tovább. A fizetési oldal megjelenését a szolgáltatód beállításaiban szabhatod a saját arculatodra.

## A küldés gomb elrejtése feltételes érvényesítéssel

A **Feltételes érvényesítés** szekcióban a **Ha ez a feltétel nem teljesül, a küldésgomb legyen** beállítással a gombot rejtetté teheted: ilyenkor addig nem jelenik meg, amíg a feltétel nem teljesül. Részletek: Feltételes mezők és feltételes érvényesítés.

## Összetett feltételek láncolása

Ha több feltételt kell egyszerre teljesíteni, ne zsúfold őket egyetlen kifejezésbe: vegyél fel külön feltételeket a **Feltételes érvényesítés** szekcióban, mert az űrlap csak akkor érvényes, ha **mindegyik** igaz. A példában az űrlap csak akkor küldhető el, ha a keresztnév Aron vagy Paul, és a vezetéknév Stone vagy Annabel.

1. Vegyél fel két mezőt: **Keresztnév** (`fname`) és **Vezetéknév** (`lname`).
2. Nyisd meg a **Feltételes érvényesítés** szekciót, és az első feltétel **Kifejezés** mezőjébe írd: `fname == "Aron" or fname == "Paul"`. A kifejezést a **Conditions Generator** online eszközzel is előállíthatod.
3. A **Hibaüzenet** mezőbe írd be a szöveget, amelyet a látogató lát, ha a feltétel nem teljesül.
4. A **A hibához csatolandó mező ID-je (opcionális)** mezőbe beírhatod annak a mezőnek az azonosítóját, amelynél a hibaüzenet megjelenjen.
5. A másoló ikonnal vegyél fel egy második feltételt, és a **Kifejezés** mezőjébe írd: `lname == "Stone" or lname == "Annabel"`. Adj neki is hibaüzenetet.
6. Ha azt szeretnéd, hogy a küldésgomb addig ne jelenjen meg, amíg a feltételek nem teljesülnek, állítsd rejtettre a **Ha ez a feltétel nem teljesül, a küldésgomb legyen** beállítást. A második feltételnél beállítva a gomb csak akkor látszik, ha mindkét mező feltétele teljesül.

![A Feltételes érvényesítés szekció feltétellel](./kepek/elementor-pro-form-feltetel-ervenyesites.webp)

*A Feltételes érvényesítés szekció feltétellel* (https://minta-bolt.hu/wp-admin/post.php?post=63&action=elementor)

A képen az egyik feltétel beállításai látszanak: a kifejezés, a hibaüzenet és a küldésgomb elrejtése.

## Teljes űrlaplépés kihagyása feltételes mezőkkel

Többlépéses űrlapban egy egész lépést átugorhatsz, ha a lépés minden mezőjét feltételhez kötöd. A példában a második lépés két mezője (a kedvenc ütő és a kedvenc dobó a krikettről) csak akkor kell, ha a látogató az első lépésben érdeklődést jelzett a sport iránt.

1. Az első lépésben vegyél fel egy **Választó** mezőt „Érdekel a krikett?” felirattal, **Igen** és **Nem** elemekkel.
2. A második lépés mindkét mezőjénél add meg a feltételes mező kifejezését úgy, hogy a mező csak akkor jelenjen meg, ha az első mező értéke az **Igen**.
3. Ha a látogató a **Nem** választ, a második lépés minden mezője rejtett, és az űrlap átlépi a lépést.

![Az űrlap lépései](./kepek/elementor-pro-form-lepesek.webp)

*Az űrlap lépései* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

## Beküldött adatok megjelenítése másik oldalon

Ha a beküldés után egy köszönő oldalon vissza akarod mutatni, amit a látogató megadott, a **Dinamikus átirányítás** művelettel URL-paraméterekben viheted át az adatokat, a célon pedig tokenekkel írod ki őket.

1. Az űrlapon legyen név, e-mail, tárgy és üzenet mező. A mezők azonosítói a példában: `name`, `email`, `subject`, `message`.
2. A **Küldés utáni műveletek** között add hozzá a **Dinamikus átirányítás** műveletet, és az **Átirányítás ide** mezőbe írj egy belső oldalcímet paraméterekkel, például: `https://pelda.hu/elonezet/?uname=[form:name|str_replace(' ','_')]&usubject=[form:subject|str_replace(' ','_')]`
3. Az `uname` és `usubject` tetszőleges paraméternév. Az értékekben a szóközöket aláhúzásra cseréljük, hogy a célon pontosan vissza lehessen alakítani őket.
4. A célként megadott oldalon egy szövegben jelenítsd meg a paramétereket tokenekkel:

```text
Szia [system:get:uname|str_replace('_',' ')|sanitize_text_field], a(z) [system:get:usubject|str_replace('_',' ')|sanitize_text_field] tárgyú üzeneted megérkezett.
```

![A Dinamikus átirányítás szekció az URL-paraméterekkel](./kepek/elementor-pro-form-atiranyitas.webp)

*A Dinamikus átirányítás szekció az URL-paraméterekkel* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

Fontos tudnivalók:

- A `name` WordPress által fenntartott kifejezés, és 404-es hibát okozhat az átirányított címen. Ha ilyet látsz, használj más paraméternevet (a példában ezért `uname`).
- Az átirányítási címben a `pelda.hu` helyére mindig a saját domainedet írd.
- A `sanitize_text_field` függvény hozzáfűzése megvéd az XSS-támadásoktól, ezért a kimeneten mindig használd.
- A Dinamikus átirányítás paramétereiről részletesebben a Dinamikus átirányítás fejezet szól.

## Bejegyzés szerkesztése űrlappal a felhasználónak

A **Mentés** művelettel a bejelentkezett felhasználók a saját bejegyzéseiket is módosíthatják. A megoldás három részből áll: megmutatod a felhasználónak a saját bejegyzéseit, a bejegyzés oldalán űrlapot jelenítesz meg, az űrlap pedig frissíti a bejegyzést.

1. Az oldalon használd az **Aktuális felhasználó bejegyzései** widgetet, hogy a bejelentkezett felhasználó a saját bejegyzéseit lássa a kívánt elrendezésben.
2. Szerkeszd a bejegyzés egyedi sablonját (single), vegyél fel egy szakaszt, és húzz bele egy **Űrlap** widgetet.
3. A szakasz **Láthatóság** fülén kapcsold be a **Felhasználó és szerepkör** eseményindítót, és állítsd be, hogy a szakasz csak a kiválasztott szerepköröknek jelenjen meg.
4. Az űrlapon vegyél fel mezőket: egyet a címnek és egyet a tartalomnak (a példában `post_title` és `post_content` azonosítóval).
5. A **Küldés utáni műveletek** között add hozzá a **Mentés** műveletet.
6. A **Mezők mentése másként** választóban válaszd a bejegyzés ikont.
7. Kapcsold be a **Létező adatok frissítése** kapcsolót. Ha a bejegyzés azonosítóját nem adod meg, az aktuális bejegyzés frissül.
8. A **Mentendő űrlapmezők** mezőbe írd az azonosítókat: `post_title,post_content`.
9. Mentsd az oldalt.

![A Mentés művelet beállításai](./kepek/elementor-pro-form-mentes.webp)

*A Mentés művelet beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=62&action=elementor)

A bejelentkezett felhasználók ezután látják a saját bejegyzéseiket, megnyitás után pedig az űrlappal szerkeszthetik a címet és a tartalmat.

## ACF-mezők frissítése az oldalról

Az ACF-mezőket is frissítheted az oldalról az űrlap **Mentés** műveletével. A **Mentendő űrlapmezők** mezőbe azokat a mezőazonosítókat írd, amelyeket metaadatként el akarsz menteni. A mezőazonosítónak meg kell egyeznie az ACF-mező nevével. Csak a felsorolt mezők mentődnek, ezért ne hagyd üresen a listát (a Mentés fejezet leírja a részleteket, többek között a csoportban lévő ACF-mezők `csoportID_mezoID` alakú azonosítóját).

## Az űrlap beküldéseinek korlátozása számlálóval

Ha például jegyeket árulsz egy eseményre, vagy az első 1000 jelentkezőnek adsz kupont, korlátozhatod, hányszor küldhető be az űrlap. A példában 1000 korai jelentkezőt várunk. (Egyszerűbb megoldás a **Maximális beküldésszám** szekció, lásd a [Megerősítő párbeszédablak és maximális beküldésszám](https://hub.hellowp.io/hu/plugins/dynamic-content-for-elementor/elementor-pro-form-megerosites-es-korlat/) fejezetet.)

Három kiegészítést használsz hozzá: a **Számláló** mezőt, a **Feltételes érvényesítést** és az **Üzenet** műveletet.

1. Vegyél fel az űrlapra egy **Számláló** mezőt, a kezdőértéke legyen `1`, a lépésköze `1`. A számláló a kezdőértékről indul, és minden beküldéssel a lépésközzel nő. Tedd rejtetté, hogy a kitöltők ne lássák.
2. Nyisd meg a **Feltételes érvényesítés** szekciót, és a **Kifejezés** mezőbe írd: `counter < 1001`. Ez addig fogadja el a beküldést, amíg a számláló 1001 alatt van. Ugyanezt jelenti a `counter <= 1000` is. A `counter` helyére a saját számlálód mezőazonosítója kerüljön.
3. Add meg a **Hibaüzenet** szöveget, amelyet a látogató a korlát elérése után lát.
4. Ha tájékoztatni akarod a látogatót az eddigi jelentkezők számáról, adj hozzá **Üzenet** műveletet, és a szövegében használd a számláló mezőjének tokenjét.

![Az űrlap számláló mezője](./kepek/elementor-pro-form-szamlalo.webp)

*Az űrlap számláló mezője* (https://minta-bolt.hu/wp-admin/post.php?post=64&action=elementor)

A képen a **Számláló** mező beállításai látszanak.

![A Feltételes érvényesítés szekció a korlát kifejezésével](./kepek/elementor-pro-form-feltetel-ervenyesites.webp)

*A Feltételes érvényesítés szekció a korlát kifejezésével* (https://minta-bolt.hu/wp-admin/post.php?post=63&action=elementor)

A képen a feltételes érvényesítés látszik: itt adod meg a `counter < 1001` típusú kifejezést.

## Kifejezések összeállítása a Conditions Generatorral

A **Feltételes mezők** és a **Feltételes érvényesítés** kifejezéseit a gyártó online **Conditions Generator** eszközével is összeállíthatod, ha a kifejezés bonyolultabb. A kifejezések szintaxisát a [Feltételes mezők és feltételes érvényesítés](https://hub.hellowp.io/hu/plugins/dynamic-content-for-elementor/elementor-pro-form-feltetelek/) fejezet írja le. Az eszköznél a következőket kell kitöltened:

1. Válaszd ki annak a mezőnek a **típusát**, amelyre a feltétel épül.
2. Add meg a mező **azonosítóját**.
3. Válaszd ki az **összehasonlítás** módját.
4. Döntsd el, hogy az érték szöveg, szám vagy egy másik mező értéke.
5. Írd be az **értéket**.
6. Az **OR** gombbal veszel fel „vagy” kapcsolatú, az **AND** gombbal „és” kapcsolatú további feltételt.
7. A kész kifejezést a feltételek fölött olvasod le, és bemásolod az űrlap **Kifejezés** mezőjébe.

Az **OR** művelettel írt feltételek „vagy” kapcsolatban vannak. A külön sorba írt kifejezések alapértelmezés szerint „és” kapcsolatban állnak. Az eszközt a **Feltételes mezők**, a **Feltételes érvényesítés** és a feltételes műveletek (például a **Dinamikus átirányítás**, a **Dinamikus e-mail** és a **Telegram**) kifejezéseihez használhatod.

## E-mailek küldése SMTP-bővítménnyel

Előfordulhat, hogy a **Dinamikus e-mail** levelei nem érkeznek meg: a PHP `mail()` függvény rosszul van beállítva a szerveren, a tárhely letiltotta a portot, vagy a levél a címzett spam mappájába kerül. Ilyenkor érdemes SMTP-t használni, mert a hitelesítés miatt jóval nagyobb eséllyel jut el a levél a postafiókba.

1. Telepíts egy SMTP-bővítményt, például az ingyenes **WP Mail SMTP** bővítményt.
2. Hozz létre fiókot egy levelezőszolgáltatónál (például SendGrid, Sendinblue, Mailgun vagy Gmail SMTP), és szerezd meg az API-kulcsot vagy a hozzáférési adatokat.
3. Add meg ezeket az SMTP-bővítmény beállításaiban. A bővítmény telepítővarázslója is segít a szolgáltató beállításában.

Utána a **Dinamikus e-mail** művelet a beállított SMTP-n keresztül küldi a leveleket.