Elementor Pro űrlap: gyakorlati példák

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.

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).

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.

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.

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.

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:

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

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.

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 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.

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.

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 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.