# Beszélgetős űrlap

> Egyszerre egy kérdést mutató, csevegésszerű űrlap létrehozása, megtervezése, megosztása és beágyazása.

A beszélgetős (konverzációs) űrlap egyszerre egy kérdést mutat, mint egy beszélgetés. Így a kitöltők figyelme nem szóródik szét egy hosszú űrlapon. Bármelyik űrlapot beszélgetős megjelenéssel is megoszthatod, és külön tervezheted a színeit, a hátterét és a szövegeit.

## Beszélgetős űrlap létrehozása

1. Nyisd meg a **Fluent Forms Pro → Űrlapok** oldalt, és kattints az **Új űrlap hozzáadása** gombra.
2. Az **Új űrlap létrehozása** ablakban válaszd a **Konverzációs űrlap létrehozása** kártyát.
3. Megnyílik a szerkesztő négy előre felvett mezővel (név, e-mail, tárgy, üzenet), amelyeket átalakíthatsz, és újakat is hozzáadhatsz.
4. Egy mezőn a következő műveletek érhetők el: húzás az áthelyezéshez, a ceruza ikon a beállításokhoz (a jobb oldali **Beviteli mezők testreszabása** fülön), másolás, kuka ikon a törléshez és a **+** ikon új mező felvételéhez. Új mezőt a jobb oldali **Beviteli mezők** fülről is hozzáadhatsz.
5. Mentsd az űrlapot a **Save Form** gombbal. Az **Előnézet** gombbal megnézheted az eredményt, a rövidkódot a felső sávból másolhatod ki.

Beszélgetős űrlapban a tárolómezők nem használhatók.

![Egy új beszélgetős űrlap a szerkesztőben](./kepek/urlapok-letrehozasa-beszelgetos-szerkeszto.webp)

*Egy új beszélgetős űrlap a szerkesztőben* (https://minta-bolt.hu/wp-admin/admin.php?page=fluent_forms&form_id=3&route=editor)

A vásznon az előre felvett négy mező látszik, a felső sávban a **Szerkesztő** mellett megjelenik a **Dizájn** fül.

## Az űrlap megtervezése

A tervezéshez nyisd meg a beszélgetős űrlapot a szerkesztőben (**Űrlapok** lista, majd **Szerkesztés**), és kattints a felső sáv **Dizájn** fülére. A bal oldali panelen három fül van: **Design**, **Meta** és **Share**. A jobb oldalon élő előnézet látszik, amelyet **Mobile** és **Desktop** nézetre válthatsz.

### Design: a megjelenés

| Beállítás | Mit csinál |
|---|---|
| **Betűtípus** | Az űrlap betűcsaládja. Alapból „A rendszer alapértelmezett beállításának” megfelelő. |
| **Kérdések** | A kérdések színe. |
| **Válaszok** | A válaszok színe. |
| **Gomb** | A gomb színe. |
| **Gomb szövege** | A gomb feliratának színe. |
| **Háttér** | A háttér színe. |
| **Background Image** | Háttérkép feltöltése az **Upload Media** gombbal. Feltöltés után a kép fényerejét is állíthatod. |
| **Elrendezés kikapcsolása mobileszközökön** | Mobilon elrejti az egyedi elrendezést. |
| **A következőre görgetés kikapcsolása** | Megakadályozza, hogy a látogató görgetéssel lépjen a következő kérdésre. |
| **Enable Scroll to Top** | A görgetés a lap tetejére. Alapból kikapcsolt. |
| **Márkajelzés kikapcsolása** | Elrejti a Fluent Forms márkaszövegét. |
| **Kulcsra utaló tipp** | Ha be van kapcsolva, a választógombos és jelölőnégyzetes kérdéseknél a látogató a billentyűzet betűivel (A, B, C …) is kiválaszthatja a választ. Alapból bekapcsolt. |

A módosításokat a **Save Settings** gombbal mentsd.

![A Design fül a színek, a háttérkép és a kapcsolók beállításaival](./kepek/urlapok-letrehozasa-beszelgetos-dizajn.webp)

*A Design fül a színek, a háttérkép és a kapcsolók beállításaival* (https://minta-bolt.hu/wp-admin/admin.php?page=fluent_forms&form_id=3&route=conversational_design)

Balra a beállítások, jobbra az élő előnézet látszik, alul a **Mobile** és **Desktop** váltóval.

### Meta: közösségi megosztás és szövegek

A **Meta** fülön a közösségi megosztás szövegeit és az űrlap üzeneteit állíthatod. A **Save Settings** gombbal mentesz.

| Beállítás | Mit csinál |
|---|---|
| **Meta cím** | A böngészőfülön megjelenő cím. |
| **Meta leírás** | Rövid összefoglaló az űrlap oldaláról. |
| **Featured Image** | A közösségi megosztás előnézeti képe (**Upload Media**). |
| **Biztonsági kód (opcionális)** | Sóként szolgál a megosztási URL-hez, így az űrlap azonosítójából nem lehet kitalálni a hivatkozást. |
| **Folytatás gomb szövege** | A folytatás gomb felirata. |
| **Kihagyás gomb szövege** | A kihagyás gomb felirata. |
| **Útmutató a következő kérdésre billentyűzettel történő továbblépéshez** | Tájékoztató szöveg a következő kérdésre lépéshez. |
| **Tipp sortörés készítéséhez a szövegmezőben** | Segítség a sortöréshez a szövegmezőben. |
| **Tipp több elem kijelöléséhez** | Jelzi, hogy több válasz is választható. |
| **Billentyűzetes tipp szövege** | A billentyűs választás tippjének szövege. |
| **Megerősítő gomb szövege** | A megerősítő gomb felirata. |
| **Tipp egyetlen opció kijelöléséhez** | Jelzi, hogy csak egy válasz választható. |
| **Előrehaladás szövege** | Az előrehaladás kijelzője. Változók: `{percent}`, `{step}`, `{total}`. |
| **Hibás adat esetén megjelenő üzenet** | Ezt látja a látogató, ha egy mezőt hibásan töltött ki. |
| **Alapértelmezett helyőrző** | A mezők alapértelmezett helyőrző szövege. |
| **Billentyűzetes tipp buboréksúgója** | A billentyűs tipp súgószövege. |
| **Fájlfeltöltési méretkorlát szövege** | A javasolt feltöltési méretkorlátot leíró szöveg. |

![A Meta fül a megosztási adatokkal és az űrlapüzenetekkel](./kepek/urlapok-letrehozasa-beszelgetos-meta.webp)

*A Meta fül a megosztási adatokkal és az űrlapüzenetekkel* (https://minta-bolt.hu/wp-admin/admin.php?page=fluent_forms&form_id=3&route=conversational_design)

Fent a megosztási adatok (cím, leírás, kép, biztonsági kód), alatta az űrlap üzenetei és gombfeliratai látszanak.

### Share: megosztás és beágyazás

A **Share** fülön az űrlapot megoszthatod egyedi hivatkozással, vagy rövidkóddal teheted ki az oldalra.

- **Share Via Direct URL**: az űrlap közvetlen hivatkozása, amelyet másolhatsz vagy közösségi oldalakon oszthatsz meg.
- **Email Share**: kész üzenet a hivatkozás e-mailben küldéséhez.
- **QR Code**: QR-kód nyomtatott vagy személyes megosztáshoz, letölthető SVG-ként.
- **Shortcode a beszélgetős űrlaphoz**: a beszélgetős megjelenésű űrlap rövidkódja (például `[fluentform type="conversational" id="3"]`).
- **Shortcode a klasszikus űrlaphoz**: ugyanaz az űrlap hagyományos megjelenéssel (például `[fluentform id="3"]`).
- **Embed via HTML Code**: iframe-kód, ha az űrlapot másik webhelyen vagy WordPressen kívül akarod használni. A magasságot (`height`) átírhatod, és a tárhelynek támogatnia kell az iframe-et.
- **Pretty URL**: a hivatkozás szebb formája, kapcsolóval állítható.

![A Share fül a hivatkozással, QR-kóddal és a rövidkódokkal](./kepek/urlapok-letrehozasa-beszelgetos-megosztas.webp)

*A Share fül a hivatkozással, QR-kóddal és a rövidkódokkal* (https://minta-bolt.hu/wp-admin/admin.php?page=fluent_forms&form_id=3&route=conversational_design)

Fentről lefelé a közvetlen hivatkozás, az e-mail szöveg, a QR-kód, a két rövidkód és a beágyazási kód látszik.

A tervezés után kattints a **Save Form** gombra, és az **Előnézet** gombbal ellenőrizd az eredményt.