# Beágyazás oldalépítőkkel: Elementor és Oxygen

> A Fluent Forms widget használata az Elementorban és az Oxygen Builderben, és az űrlap kinézetének beállításai.

Az Elementor és az Oxygen Builder oldalépítőben az űrlapot widgetként teheted az oldalra, és kód nélkül állíthatod a színeit, méreteit, hátterét és térközeit.

## Elementor

### Az űrlap hozzáadása

1. Nyisd meg az Elementor szerkesztőt azon az oldalon, ahová az űrlap kerül.
2. A widgetek keresőjébe írd be: Fluent Forms, és add hozzá a **Fluent Forms** widgetet az oldalhoz.
3. A widget legördülő listájából válaszd ki az űrlapot. Ha még nincs űrlapod, előbb hozz létre egyet.

### A stílus beállítása

A widget **Style** (Stílus) fülén ezek a csoportok vannak.

**Form Container** (az űrlap tárolója):

| Beállítás | Mit csinál |
| --- | --- |
| Background Type | Egyszínű háttér vagy kép. |
| Color | Globális szín vagy a színválasztóval megadott szín. |
| Image | Háttérkép feltöltése vagy kiválasztása. |
| Link Color | Az űrlapban lévő hivatkozások színe. |
| Max Width | Az űrlap legnagyobb szélessége. |
| Alignment | Balra, középre vagy jobbra igazítás. |
| Margins | Külső térköz (fent, jobbra, lent, balra). |
| Padding | Belső térköz a szegélyen belül. |
| Border Type | Szegélystílus: folytonos, dupla, szaggatott, pontozott, barázdált stb. |
| Border Radius | A sarkok lekerekítése. |
| Box Shadow | Árnyék az űrlap körül, vízszintes és függőleges eltolással, elmosással és terjedéssel. |

**Input & Textarea** (beviteli mezők és szövegterület):

- Background Color: a mező háttérszíne.
- Text Color: a szöveg színe.
- Border Type: szegélystílus (folytonos, szaggatott, pontozott vagy nincs).
- Border Radius: a sarkok lekerekítése.
- Ezen felül állítható a szöveg behúzása, a mező és a szövegterület szélessége és magassága, a belső térköz és a térközök.

**Submit Button** (beküldő gomb):

- A gomb szövegének és hátterének színe.
- Padding: a gomb belső térköze.
- Typography: a betűtípus.

## Oxygen Builder

### Az űrlap hozzáadása

1. Telepítsd és kapcsold be az Oxygen Builder bővítményt.
2. Hozz létre új oldalt, és kattints az **Edit with Oxygen** gombra.
3. A bal felső **+** ikonnal nyisd meg az elemlistát, a keresőbe írd be: Fluent Form, és kattints a **Fluent Form** elemre.
4. A legördülő listából válaszd ki az űrlapot, vagy hozz létre egy újat a Fluent Formsban.

### A kinézet beállítása

A **Primary** részben:

- **Form Container**: háttérszín, legnagyobb szélesség, belső és külső térköz. A szegélynek megadhatod a színét, vastagságát és stílusát (folytonos, szaggatott, pontozott vagy nincs), és lekerekítheted a sarkait.
- **Labels**: a szöveg és a csillag színe, valamint a betűcsalád, méret, vastagság, igazítás, betűköz, sormagasság, szövegdísz és stílus.
- **Input & Textarea**: a címke színe, háttér, szélesség, magasság, térközök, szöveg behúzása és a szegély tulajdonságai.
- **File Upload Field**: a fájlfeltöltő gomb színe, alakja, betűtípusa és szegélye (betűméret, vastagság, igazítás, szegélystílus, szélesség, lekerekítés).
- **Multi-step Forms**: többlépéses űrlapnál a szakaszelválasztót (Section Break) és a folyamatjelzőt (Progress Bar) stílusozhatod.
- **Box Shadow**: az űrlap körüli árnyék színe, iránya, elmosása és terjedése.
- **Submit Button**: a beküldő gomb színe, szélessége, térközei és egyéb tulajdonságai.

Az **Advanced** részben egyszerű hatásokat állíthatsz be: animációt, szövegárnyékot, átmenetet, az űrlap és a beküldő gomb átlátszóságát, valamint szűrőket és átalakításokat.

Ha elkészültél, kattints az **Apply Params** és a **Save** gombra. Ezután az oldal közzétehető, és a hivatkozása megosztható.