# Oszlopos elrendezés

> Mezők egymás mellé húzása az űrlapszerkesztőben: oszlopok létrehozása, átméretezése, sorok átrendezése, listák oszlopszáma.

A Layout & Styles bővítménnyel az űrlapszerkesztő **Űrlapmezők** fülén a mezőket nemcsak egymás alá, hanem egymás mellé is teheted. Minden átrendezés húzással megy: fogd meg a mezőt a közepén, és vidd a célhelyre.

![Az űrlapszerkesztő a kiinduló állapotban: minden mező külön sorban, egymás alatt](./kepek/szerkeszto-urlap-alap.webp)

*Az űrlapszerkesztő a kiinduló állapotban: minden mező külön sorban, egymás alatt* (https://minta-bolt.hu/wp-admin/admin.php?page=ninja-forms&form_id=2)

A képen az új űrlap látszik: minden mező saját sorban áll, teljes szélességben.

## Oszlop létrehozása

1. Nyisd meg az űrlapot a **Ninja Forms → Vezérlőpult** oldalról, és válaszd az **Űrlapmezők** fület.
2. Fogd meg az egyik mezőt a közepén.
3. Húzd egy másik mező bal vagy jobb szélére. Húzás közben a mezők két oldalán kék sávok jelennek meg.
4. Mielőtt elengeded, győződj meg róla, hogy a célsáv **zöldre** vált azon az oldalon, ahová a mezőt szánod. A zöld sáv jelzi, hogy a mező új oszlopba kerül. Ha nem látod, húzd tovább a szél felé, amíg meg nem jelenik.
5. Engedd el az egérgombot.

![A Keresztnév mező húzás közben a Vezetéknév mező jobb szélén, a célsáv zölden világít](./kepek/szerkeszto-oszlop-huzas.webp)

*A Keresztnév mező húzás közben a Vezetéknév mező jobb szélén, a célsáv zölden világít* (https://minta-bolt.hu/wp-admin/admin.php?page=ninja-forms&form_id=2)

A képen a zöld függőleges sáv mutatja, hogy a mező a Vezetéknév mellé, új oszlopba kerül.

Ugyanígy rakhatsz egymás mellé több mezőt is. Az űrlap addig nem változik az oldalon, amíg a **Közzététel** gombbal el nem mented.

![Két sor, soronként két oszloppal: Vezetéknév és Keresztnév, E-mail-cím és Telefonszám](./kepek/szerkeszto-oszlopok.webp)

*Két sor, soronként két oszloppal: Vezetéknév és Keresztnév, E-mail-cím és Telefonszám* (https://minta-bolt.hu/wp-admin/admin.php?page=ninja-forms&form_id=2)

A képen két kétoszlopos sor látszik, alattuk az **Üzenet** mező teljes szélességben. Az oszlopokat egy szürke elválasztósáv választja el.

## További elrendezési műveletek

| Mit szeretnél | Hogyan |
|---|---|
| Üres helyet hagyni a sorban | Fogd meg egy mező közepét, és húzd egy másik mező alá. |
| Mezőt ugyanabba az oszlopba tenni, mint egy másikat | Fogd meg a mező közepét, és húzd a másik mező alá. |
| Mezőt külön sorba tenni | Fogd meg a mező közepét, húzd ki az oszlopból, és vidd egy teljes szélességű mező alá. |
| Üres helyet megszüntetni | Kattints az üres oszlop törlésére szolgáló gombra. |
| Oszlopot átméretezni | Húzd el a mezők között megjelenő sávot. |
| Sorok sorrendjét megváltoztatni | Fogd meg a sor bal oldalán lévő sávot, és húzd a helyére. |

## Lista oszlopai

Egy lista típusú mező (például jelölőnégyzet-lista vagy rádiógombos lista) elemeit több oszlopban is megjelenítheted. Ehhez a lista mező beállításai között a tároló osztálynevébe írd be a `SZÁM-col-list` mintát, ahol a SZÁM az oszlopok száma betűvel. A beállítás csak bekapcsolt fejlesztői módban látszik: ezt a **Ninja Forms → Beállítások → Speciális beállítások** alatt az **Űrlapkészítő „fejlesztői mód”** kapcsolóval teheted meg.

Három oszlophoz például ez az osztálynév kell:

```text
three-col-list
```