# Regisztrációs űrlap fizetéssel

> Konferencia-regisztrációs űrlap fizetéssel: ár a választómezőből, átjáró és üzenetek makrókkal, felhasználó létrehozása sikeres fizetés után, a rögzített adatok ellenőrzése.

Ez a fejezet egy konferenciára regisztráló, fizetős űrlapot épít végig. A hangsúly a fizetési beállításokon van: az átjáró, az események és feltételek, valamint a makrók a sikeres és sikertelen fizetés üzenetében. A regisztráció és a felhasználók kezelésének részletei a JetFormBuilder saját akcióinak leírásában vannak.

Az összeget adó mező számértéket kell, hogy tartalmazzon: ezt jelölöd ki az átjáró **PRICE/AMOUNT FIELD** mezőjének.

## 1. A fizetési beállítások

1. Menj ide: **JetFormBuilder → Beállítások**, és nyisd le a **Payments Gateways** szakaszt.
2. Kapcsold be az **Enable Gateways** kapcsolót. Teszteléshez az **Enable Test Mode** kapcsolót is (ez a PayPalra hat). Az éles oldalon kapcsold ki.
3. A szakasz az elérhető átjárókat sorolja fel. A PayPal alapból elérhető, a Stripe a Stripe Gateway kiegészítővel jelenik meg.
4. Nyisd le a használni kívánt átjáró szakaszát, és írd be a kulcsokat (PayPalnál **Client ID** és **Secret Key**, Stripe-nál **Public Key** és **Secret Key**).

![A Payments Gateways beállítóoldal bekapcsolt átjárókkal](./kepek/elso-lepesek-fizetesi-atjarok-beallitas.webp)

*A Payments Gateways beállítóoldal bekapcsolt átjárókkal* (https://minta-bolt.hu/wp-admin/edit.php?post_type=jet-form-builder&page=jfb-settings)

A kulcsok megszerzését a [Fizetési átjárók beállítása](https://hub.hellowp.io/hu/plugins/jet-form-builder-stripe-gateway/elso-lepesek-fizetesi-atjarok/) fejezet írja le.

## 2. Az űrlap

1. Menj ide: **JetFormBuilder → Új űrlap hozzáadása**. A szerkesztőben a **Welcome** blokk jelenik meg, amelyből kész vagy AI-val generált űrlapot választhatsz.
2. Törölheted a blokkot, és választhatsz mintát (például a regisztrációs mintát), vagy a mezőket magad is felveheted.
3. Adj címet az űrlapnak (például „Konferencia regisztráció”).
4. Vegyél fel név, e-mail és a további adatok mezőit. A példában a mintában lévő kép helyett **Media Field** (fájlfeltöltés) áll.
5. Vegyél fel egy **Select Field** mezőt a részvétel típusához, és tedd a küldőgomb fölé. Ez lesz az átjáró **PRICE/AMOUNT FIELD** mezője.
6. Kattints a **Manage Items** gombra, és adj meg két opciót (például „Teljes részvétel vacsorával (tag)” és „Teljes részvétel vacsorával (nem tag)”) a hozzájuk tartozó **VALUE** és **CALCULATE** értékkel. Az **Update** gombbal zárd az ablakot.

![Az űrlapszerkesztő név, e-mail és részvételtípus-választó mezővel](./kepek/fizetesi-modok-urlap-szerkeszto.webp)

*Az űrlapszerkesztő név, e-mail és részvételtípus-választó mezővel* (https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit)

A képen a kész űrlap látszik: a **Részvétel típusa** választómező adja majd az összeget.

## 3. Az átjáró beállítása az űrlapon

A **JetForm** fül **Gateways Settings** szakaszában az elérhető átjárók választhatók (**None**, **PayPal Checkout**, **Stripe Checkout**). Egyszerre csak egy átjáró lehet aktív, ha mégis többet akarsz, használd a **Manual** módot: [PayPal és Stripe egy űrlapon](https://hub.hellowp.io/hu/plugins/jet-form-builder-stripe-gateway/fizetesi-modok-paypal-es-stripe/).

### PayPal Checkout

1. Jelöld ki a **PayPal Checkout** lehetőséget, és kattints az **Edit** gombra.
2. Kapcsold be a **Use Global Settings** kapcsolót: a **CLIENT ID** és a **SECRET KEY** a globális beállításból töltődik ki.
3. Kattints a **Sync Access Token** gombra. A szinkron végén a gomb felirata **Access Token updated** lesz.
4. Írd be a **CURRENCY CODE** mezőbe a pénznem kódját (például `USD`, `HUF`), és válaszd ki a **PRICE/AMOUNT FIELD** értékét (itt a részvétel típusa mezőt).
5. Írd meg a **PAYMENT SUCCESS MESSAGE** és a **PAYMENT FAILED MESSAGE** szövegét. Használhatsz makrókat:
   - `%mezőnév%`: az űrlap adott mezőjének értéke (például `%nev%`),
   - `%gateway_amount%`: a fizetett összeg, az összegmezőből.
6. Kattints az **Update** gombra.

Példa a sikeres fizetés üzenetére:

```text
Kedves %nev%! A fizetésedet %gateway_amount% összegben megkaptuk. Köszönjük a részvételt!
```

### Stripe Checkout

A **Stripe Checkout** beállítása ugyanilyen. Jelöld ki, kattints az **Edit** gombra, kapcsold be a **Use Global Settings** kapcsolót, és kattints a **Sync Access Token** gombra. Utána megjelenik a **CURRENCY CODE**, a **PRICE/AMOUNT FIELD** és az üzenetek mezője, előtöltve az előbbi adatokkal. Add meg a pénznemet, és az **Update** gombbal mentsd.

![Az Edit Stripe Checkout Settings ablak](./kepek/fizetesi-modok-stripe-ablak.webp)

*Az Edit Stripe Checkout Settings ablak* (https://minta-bolt.hu/wp-admin/post.php?post=7&action=edit)

A képen a Stripe Checkout beállítóablaka látszik; a kulcsok kitöltése után a pénznem és az összegmező is itt adható meg.

## 4. Beküldés utáni akciók

A **Post Submit Actions** szakaszban alapból ott van a **Save Form Record** akció. A **New Action** gombbal vegyél fel egy **Register User** akciót, hogy a sikeres fizetés után fiók jöjjön létre.

1. A **Register User** ablakban kapcsold be az **Allow creating new users by existing users** kapcsolót.
2. A **WHO CAN ADD NEW USER** listából válaszd az **Administrator** értéket, és a **FIELDS MAP** részben rendeld az űrlapmezőket a felhasználói adatokhoz.
3. Válaszd ki a **USER ROLE** értékét (itt **Author**).
4. Ha azt szeretnéd, hogy a regisztráló be is lépjen, kapcsold be a **Log In User after Register** kapcsolót.
5. Kattints az **Update** gombra.

Hogy a felhasználó csak sikeres fizetés után jöjjön létre:

1. Vidd az egeret az akció fölé, és kattints az **Edit Conditions & Events** gombra.
2. Nyisd meg az **Events match** fület.
3. Az **ADD EVENT** listából válaszd a `GATEWAY.SUCCESS` eseményt.
4. Kattints az **Update** gombra. Az akció alatt megjelenik a `GATEWAY.SUCCESS` felirat.

Az események működését az [Akciók és események](https://hub.hellowp.io/hu/plugins/jet-form-builder-stripe-gateway/elso-lepesek-akcio-esemenyek/) fejezet írja le. A felhasználó regisztrálása előtt e-mail-megerősítést is kérhetsz (**Verification**). Az űrlap tetején a **Mentés** (közzététel) gombbal mentsd el az űrlapot.

## 5. Az űrlap az oldalra kerül

Nyiss meg egy oldalt a kedvenc szerkesztőddel, keresd meg a **JetForm** widgetet (blokkot, elemet), és válaszd ki benne az űrlapot. Elementorban, a blokkszerkesztőben és a Bricksben is ugyanígy megy.

## 6. Kitöltés és eredmény

Töltsd ki az űrlapot a nyilvános felületen, és küldd be. Sikeres beküldés után a fizetőoldalra kerülsz (PayPalnál a PayPal, Stripe-nál a Stripe fizetőoldalára). A fizetés után a rendszer visszavisz az űrlaphoz, ahol a megadott üzenet jelenik meg, például: „Kedves Teszt Elek! A fizetésedet 15 000 Ft összegben megkaptuk. Köszönjük a részvételt!”

## 7. Hol találod az adatokat?

### Űrlapbeküldések

Mivel a **Save Form Record** akció be van állítva, a beküldések a **JetFormBuilder → Form Records** oldalon jelennek meg a státuszukkal. A részletekhez vidd az egeret a név fölé, és kattints a **Edit** (megtekintés) linkre.

### Fizetések

A **JetFormBuilder → Payments** oldal az összes fizetést és adatait gyűjti. A név fölé víve a **View** linkkel megnyithatod egy fizetés részleteit.

![A fizetések listája a JetFormBuilder Payments oldalán](./kepek/elofizetesek-fizetesek.webp)

*A fizetések listája a JetFormBuilder Payments oldalán* (https://minta-bolt.hu/wp-admin/edit.php?post_type=jet-form-builder&page=jfb-payments)

A képen a fizetések listája látszik; innen nyithatók meg az egyes fizetések részletei.

### Felhasználók

Hogy létrejött-e a felhasználó, a **Felhasználók** oldalon látod. Az új fiók a kiválasztott szereppel (itt **Szerző**) szerepel a listában. A **Felhasználó szerkesztése** oldalon ellenőrizheted, hogy az űrlapon megadott adatok bekerültek-e.