# Harmonika blokk

> Összecsukható szakaszok listája: elemek felvétele és rendezése, az eszköztár, a beállítások és a belső blokkok.

A **Harmonika** blokk összecsukható szakaszokban jeleníti meg a tartalmat, így az olvasó csak azt nyitja ki, amire szüksége van. Gyakran használják GYIK-hoz, programok listájához, vagy egy hosszú oldal áttekinthetőbbé tételére. A harmonika **Harmonika elem** blokkokból áll; minden elemnek két része van:

- **Harmonika fejléc:** a kattintható cím.
- **Harmonika panel:** a ki- és becsukódó tartalom, amelybe bármilyen blokkot tehetsz.

## A blokk hozzáadása

Kattints a **+** gombra, keresd meg a **Harmonika** blokkot, és kattints rá. Egy üres sorba írt `/accordion` is beszúrja.

## Elemek felvétele, szerkesztése és rendezése

- **Új elem:** kattints a blokkban a **+** gombra, vagy az eszköztáron az **Elem hozzáadása** gombra.
- **Fejléc szerkesztése:** kattints a fejlécre, és írj egy rövid, beszédes címet.
- **Tartalom:** kattints a panelbe, és tegyél bele bármit: bekezdést, képet, listát és így tovább.
- **Sorrend:** az eszköztár mozgatógombjaival, vagy a **Lista nézetben** húzással változtathatod.
- **Kinyitás és becsukás szerkesztés közben:** a fejlécre kattintva megnyithatod vagy becsukhatod a panelt, hogy egyszerre egy elemre figyelj.

## Az eszköztár

![A Harmonika blokk kijelölve a szerkesztőben, mellette a Lista nézet az oldalsávon](./kepek/blokkok-harmonika-szerkeszto.webp)

*A Harmonika blokk kijelölve a szerkesztőben, mellette a Lista nézet az oldalsávon* (https://minta-bolt.hu/wp-admin/post.php?post=26&action=edit)

A képen a kijelölt blokk két elemmel látszik. Az oldalsáv a **Lista nézet** fülön a két elem fejlécét és panelét mutatja.

- **Átalakítás:** a harmonikát Oszlopok, Részletek vagy Csoport blokkká alakítja.
- **Húzás** és **Mozgatás fel / le:** a blokk áthelyezése az oldalon.
- **Igazítás módosítása:** nincs, széles vagy teljes szélesség. Az utóbbi kettő csak akkor érhető el, ha a téma támogatja.
- **Szint** (a képen **H3**): a fejlécek címsorszintje a blokkon belül.
- **Elem hozzáadása:** új harmonikaelem a blokk végére.
- **Beállítások** (három pont): másolás, kettőzés, törlés és más műveletek.

## A beállítások

Az oldalsávon három fül van: **Lista nézet**, **Beállítások** (fogaskerék) és **Stílusok** (félig kitöltött kör).

### Lista nézet

A fa nézet a **Harmonika elem** blokkokat, azok fejlécét és panelét mutatja. Itt húzással sorba rendezheted az elemeket. A fejléc és a panel zárolt, külön nem törölhető.

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

| Beállítás | Mit csinál |
|---|---|
| **Automatikus bezárás** | bekapcsolva a harmonika egy új elem kinyitásakor magától becsukja a többit |
| **Ikon megjelenítése** | bekapcsolva ikon látszik a fejlécnél |
| **Ikon pozíciója** | az ikon a cím bal vagy jobb oldalán áll |

A **Haladó** panelen: HTML-horgony, további CSS-osztályok és további CSS.

### Stílusok fül

- **Betűkészlet:** betűtípus, méret, megjelenés, sormagasság, kis- és nagybetűk, betűköz, díszítés.
- **Háttér:** háttérkép, szín és színátmenet.
- **Elrendezés:** a belső blokkok a tartalom szélességét használják-e. Bekapcsolva a belső blokkok kitöltik a harmonika szélességét. A témától függően a harmonika széles vagy teljes szélességű is lehet.
- **Méretek:** belső és külső margó és más méretek.
- **Keret és árnyék:** keretszín, vastagság, lekerekítés és árnyék.

## A harmonika belső blokkjai

A harmonika három blokkból áll: a **Harmonika elem**, a **Harmonika fejléc** és a **Harmonika panel** blokkból. Ezekhez a témától függően további stílusbeállítások (szín, betűkészlet, térközök) tartozhatnak. A fejléc címsorszintjét (például H3 vagy H4) az oldal szerkezetéhez illően válaszd meg.

## Tippek

- Tartsd rövidnek és beszédesnek a fejléceket, hogy az olvasó lássa, mi van az elemben.
- Egy harmonikán belül használj azonos címsorszintet, és illeszd az oldal címsorszerkezetéhez.
- Hosszú tartalmat érdemes kisebb elemekre bontani, vagy a panelben listát használni.
- A gyakran használt harmonikát (például egy GYIK-et) mentsd mintázatként, hogy az oldalakon újra felhasználhasd.

## Akadálymentesség

A fejlécek gombként működnek, a panelek pedig jelzik a segítő technológiának, hogy nyitottak vagy csukottak. Hogy ez jól működjön:

- használj beszédes, rövid fejléceket;
- ne tegyél interaktív elemet (hivatkozást, gombot) magába a fejlécbe, azokat a panelbe tedd;
- olyan címsorszintet válassz, amely illeszkedik az oldal szerkezetéhez.

## Gyakori kérdések

**Mi a különbség a Harmonika és a Részletek között?** A [Részletek](https://hub.hellowp.io/hu/manuals/wordpress/blokkok/blokkok-reszletek/) egyetlen összecsukható szakasz. A Harmonika összehangoltan működő elemek listája, amelyből egyszerre egy vagy több is nyitva lehet.

**Nyithatok egyszerre több elemet?** Igen. Kapcsold ki az **Automatikus bezárás** beállítást a Harmonika blokk beállításai között.

**Hogyan lesz egy elem alapból nyitva?** Jelöld ki a **Harmonika elem** blokkot, és kapcsold be a nyitott kezdőállapotot az elem beállításai között.

**Tehetek bármit a panelbe?** Igen, képet, listát és beágyazott tartalmat is.