# Oszlopok blokk

> Szöveg, kép és más blokkok elrendezése egymás mellett oszlopokban: hozzáadás, szélesség, igazítás és stílusok.

Az **Oszlopok** blokkal szöveget, képet és más blokkokat tehetsz egymás mellé. Ha több Oszlopok blokkot raksz egymás alá, rácsszerű elrendezést kapsz.

## A blokk hozzáadása

Egy üres Bekezdés blokkban írd be, hogy `/oszlopok` (vagy `/columns`), és nyomj entert, vagy válaszd a blokkot a **+** gombbal. A beszúrás után egy kiinduló elrendezést választhatsz (például 100, 50/50, 33/66). Ha alul a **Kihagyás** gombra kattintasz, két egyenlő (50/50) oszlop jön létre. Az oszlopok számát később is módosíthatod.

## Oszlopok hozzáadása és törlése

- Vidd az egeret két oszlop közé, és kattints a megjelenő **+** gombra, így az adott helyre új oszlop kerül.
- Az oldalsávban az **Oszlopok** csúszkával vagy számmezővel állítsd be az oszlopok számát (1-től 6-ig).
- Oszlop törléséhez jelöld ki az adott Oszlop blokkot, és válaszd a **Törlés** parancsot a három pontos menüből (a Lista nézetben vagy az eszköztáron).

## Tartalom az oszlopokban

Minden oszlopba tehetsz más blokkokat. Néhány ötlet:

- Egy **Kép**, egy **Címsor** és egy **Bekezdés** oszloponként, így szolgáltatásokat vagy termékeket mutathatsz be rácsban.
- **Borítókép** blokkok oszloponként, így vizuális kártyák sora jön létre.
- **Gombok** blokk oszloponként egy-egy gombbal. Ha azt szeretnéd, hogy a gombok egyforma szélesek legyenek, állítsd mindegyiket 100% szélesre.

![Az Oszlopok blokk kijelölve: eszköztár és a Beállítások fül](./kepek/blokkok-oszlopok-szerkeszto.webp)

*Az Oszlopok blokk kijelölve: eszköztár és a Beállítások fül* (https://minta-bolt.hu/wp-admin/post.php?post=19&action=edit)

A képen három oszlop látszik, mindegyikben egy címsor és egy bekezdés. Az oldalsávban az oszlopok száma és az **Egymás alá mobilon** kapcsoló látszik.

## Az eszköztár

Az eszköztár gombjai: **Oszlopok** (átalakítás), **Húzás**, **Mozgatás fel** és **Mozgatás le**, **Igazít**, **Függőleges igazítás**, **Beállítások** (három pont).

### Átalakítás

Az első gombbal a blokkot Csoporttá, Részletekké vagy Rács blokká alakíthatod. Rács blokká alakításkor az oszlopok tartalma megmarad. Gyakori trükk, hogy az Oszlopokat Csoport blokkba teszed: így a szakasznak saját háttérszíne és térköze lehet. A csoportosítást a **Csoport szétbontása** paranccsal szüntetheted meg.

### Mozgatás

A **Húzás** gombbal a kívánt helyre húzhatod a blokkot, a nyilakkal egy lépéssel feljebb vagy lejjebb viheted.

### Igazítás

Az **Igazít** gombbal a blokk szélességét állítod:

- **Nincs**: a blokk megtartja a mostani méretét.
- **Széles**: a tartalom szélességénél szélesebb lesz.
- **Teljes szélesség**: a képernyő teljes szélességét kitölti.

### Függőleges igazítás

A gombbal azt állítod be, hogyan helyezkedik el a tartalom az oszlopokban. Ez akkor látszik, ha az oszlopokban különböző mennyiségű tartalom van. A lehetőségek: felülre, középre és alulra igazítás. Az egyes Oszlop blokkoknak is van függőleges igazításuk; az alapértelmezett a kitöltés magasságra, amely az oszlopot az Oszlopok blokk teljes magasságára nyújtja. Ez akkor hasznos, ha az oszlopoknak kerete vagy háttere van, és egyforma magasnak szeretnéd őket.

### Beállítások (három pont)

A három pontos menüből másolhatod, kettőzheted, átnevezheted, elrejtheted vagy törölheted a blokkot.

## A Blokk fül beállításai

Az oldalsáv két fület tartalmaz: a **Beállítások** és a **Stílusok** fület.

### Beállítások fül

Itt módosítod az oszlopok számát, és itt van az **Egymás alá mobilon** kapcsoló. Ez alapból be van kapcsolva: kisebb képernyőn az oszlopok egymás alá kerülnek ahelyett, hogy szűk sávokban maradnának egymás mellett.

### Stílusok fül

![Az Oszlopok blokk Stílusok füle](./kepek/blokkok-oszlopok-stilusok.webp)

*Az Oszlopok blokk Stílusok füle* (https://minta-bolt.hu/wp-admin/post.php?post=19&action=edit)

A képen a **Stíluslapok** (a téma által adott stílusok), a **Betűkészlet** és a **Háttér** panel látszik.

| Panel | Mit állíthatsz |
|---|---|
| **Stíluslapok** | A téma által kínált kész megjelenések (témától függ). |
| **Szín** | A szöveg, a hivatkozások és a háttér színe; oszloponként külön is stílusozhatod őket. |
| **Betűkészlet** | Betűtípus, megjelenés, sormagasság, betűköz, díszítés, kis- és nagybetűk, betűméret. |
| **Méretek** | Helykitöltés, margó és a blokkok közötti térköz. |
| **Keret** | A szegély színe, stílusa, vastagsága és lekerekítése. |
| **Haladó** | HTML-horgony, további CSS-osztályok, további CSS és stílusok. |

### Egy oszlop szélessége

Egy oszlop szélességének módosításához jelöld ki az adott **Oszlop** blokkot, és állítsd át a szélességet az oldalsávban. Megadhatsz px, %, em, rem, vw vagy vh egységet. Az oszlop könnyebben kijelölhető a Lista nézetből.