# Read More

> Egész szakaszok elrejtése, amelyek a gomb megnyomására egyenként vagy egyszerre jelennek meg.

A **Read More** widget egész szakaszokat rejt el, így az oldal elrendezése letisztultabb lesz. A rejtett szakaszokba bármilyen tartalom kerülhet: szöveg, videó, térkép, lista és így tovább. A **Kibontás** widgettel ellentétben a megnyitott szakasz alapesetben nem zárható vissza. A szakaszok egyenként, a beállított sorrendben jelennek meg, de egyszerre is megjeleníthetők.

## 1. A rejtendő szakasz létrehozása

1. Nyisd meg az oldalt az Elementorral.
2. Hozz létre egy szakaszt (konténert), tedd bele a tartalmat, és állítsd be a kinézetét.
3. A szakasz **Haladó** fülén add meg az egyedi azonosítót a **CSS ID** mezőben, például `rejtett-1`.

Ha több szakaszt rejtesz el, mindegyiknek külön azonosítót adj.

## 2. A Read More widget hozzáadása

Húzd a **Read More** widgetet a kívánt helyre. A bal oldali panelen két szakaszt látsz: **Szakaszok** és **Beállítások**.

![A Read More widget a szerkesztőben, a két rejtett szakasz azonosítójával](./kepek/readmore-szerkeszto.webp)

*A Read More widget a szerkesztőben, a két rejtett szakasz azonosítójával* (https://minta-bolt.hu/wp-admin/post.php?post=6&action=elementor)

### Szakaszok

A listán minden elemhez beírod egy rejtendő szakasz azonosítóját (a **CSS ID** értékét). Az **Elem hozzáadása** gombbal tetszőleges számú szakaszt felvehetsz. A szakaszok a lista sorrendjében jelennek meg, egyenként. Az elrejtett szakaszok szürkére váltanak a szerkesztőben: ez jelzi, hogy jól adtad meg az azonosítót.

### Beállítások

A gomb kinézetét és a megjelenítés módját itt állíthatod:

- **Icon**: a gomb ikonja az ikonkönyvtárból, vagy saját SVG.
- **Label**: a gomb felirata. Alapértéke **Read More**.
- **Show All Sections**: bekapcsolva a gombra kattintva az összes rejtett szakasz egyszerre jelenik meg. Kikapcsolva a szakaszok egyenként, minden kattintásra a következő jelenik meg.
- **Show Effect**: a megjelenés animációja, hatféle közül választhatsz.
- **Read Less Button**, **Read Less Icon**, **Read Less Label**, **Hide All Sections**, **Hide Effect**: a visszazáró gomb beállításai (a **Stílus** fülön a gomb külön is formázható).

Kattints a **Közzététel** vagy a **Frissítés** gombra, és nézd meg az eredményt az oldalon.

## Eredmény az oldalon

![A Read More gomb a megnyitás előtt](./kepek/readmore-elotte.webp)

*A Read More gomb a megnyitás előtt* (https://minta-bolt.hu/jettricks-demo/)

A gomb megnyomására az első rejtett szakasz jelenik meg. Újabb kattintásra a következő szakasz következik, ha a **Show All Sections** ki van kapcsolva.