# Divi 5 modulok: szövegelválasztó, szövegjelölés, szövegút, szövegforgató és gépelés

> A Divi 5 Visual Builder öt szöveges modulja: Text Divider, Text Notation, Text Path, Text Rotator és Typing.

Ebben a fejezetben öt szövegmodult találsz. Mindegyik a **Divi Supreme** kategóriában van a modulválasztóban, és a **Divi Supreme Pro → Modulok beállításai** fülön kell bekapcsolnod. A builderben a beállítások feliratai angolul maradnak. A szokásos Divi-csoportok (háttér, méret, térköz, szegély, árnyék, animáció) ott érhetők el, ahol a modul támogatja őket.

Az effektes modulok rövid kifejezésekhez, címsorokhoz valók: hero-szöveghez, szekciócímhez, akciós vagy kampánysorhoz. Hosszú törzsszöveghez használj sima szöveg modult. Olyan bekezdésnél, ahol a mozgás elvonhatja az olvasó figyelmét, maradj a statikus szövegnél.

Mindegyik modul hozzáadása ugyanígy megy:

1. Nyisd meg az oldalt a Divi 5 Visual Builderben.
2. Szúrj be egy modult, és válaszd ki a kívánt **Supreme …** modult a **Divi Supreme** kategóriából.
3. A **Content** fülön add meg a szöveget és a működési beállításokat.
4. A **Design** fülön állítsd be a színeket, a betűtípust és a térközt.
5. Mentsd az oldalt, és nézd meg a weboldalon.

A Divi 4-es shortcode-ok: `dsm_text_divider`, `dsm_text_notation`, `dsm_text_path`, `dsm_text_rotator`, `dsm_typing_effect`. A Divi 4-es elrendezések a Divi 5-ben való megnyitáskor átalakulnak.

## Szövegelválasztó (Supreme Text Divider)

Rendezett, jól olvasható címsort készít: a szöveg két oldalán választóvonal fut, többféle szegélystílussal. A szöveget a vonalak közé teheted, vagy igazíthatod a tervedhez.

| Beállítás | Fül | Mit csinál |
|---|---|---|
| **Title** | Content | A választóvonalak közé kerülő szöveg. |
| **Color** | Design | A választóvonal színe. |
| **Divider Style** | Design | A vonal stílusa. |
| **Divider Position** | Design | A vonal elhelyezkedése a szöveghez képest. |
| **Text Alignment** | Design | A szöveg igazítása. |
| **Divider Weight** | Design | A vonal vastagsága. |
| **Text Gap** | Design | A szöveg és a vonal közti távolság. |
| **Height** | Design | A választóvonal alatti hely. |

## Szövegjelölés (Supreme Text Notation)

A mondat fontos részét kézzel rajzolt hatású, animált jelöléssel emeli ki. Hét jelölésstílus közül választhatsz. A szöveg három részből áll: az előtte lévő, a jelölt és az utána lévő szövegből.

| Beállítás | Fül | Mit csinál |
|---|---|---|
| **Before Text** | Content | A jelölt rész előtti szöveg. |
| **Notation Text** | Content | A kiemelt, jelölt szöveg. |
| **After Text** | Content | A jelölt rész utáni szöveg. |
| **Type** | Content | A jelölés fajtája (hét stílus). |
| **Bracket Styles** | Content | A zárójeles jelölés stílusa. |
| **Color** | Content | A jelölés színe. |
| **Stroke Width** | Content | A jelölővonal vastagsága. |
| **Iterations** | Content | Hányszor húzza végig a jelölést. |
| **Animate in Viewport** | Content | Mennyire legyen látható a modul, hogy az animáció elinduljon. |
| **Delay** | Content | Késleltetés az animáció indulása előtt. |
| **Heading HTML Tag** | Design | A szöveg HTML-címkéje (például címsorszint). |
| **Background Color** | Design | Háttérszín, külön az előtte lévő, a jelölt és az utána lévő szövegre. |
| **Display** | Design | Megjelenítési mód, szintén külön a három részre. |

## Szövegút (Supreme Text Path)

A szöveget egy alakzat vonalára illeszti. Választhatsz a beépített alakzatok közül, vagy saját SVG-t is megadhatsz, és szabadon játszhatsz a szöveg elhelyezésével.

| Beállítás | Fül | Mit csinál |
|---|---|---|
| **Text** | Content | Az útvonalra kerülő szöveg. |
| **Path Type** | Content | Az útvonal típusa: beépített alakzat vagy saját. |
| **SVG Code** | Content | Saját útvonalhoz az SVG-kód. |
| **Text Direction** | Content | A szöveg iránya az útvonalon. |
| **Show Path** | Content | Be- és kikapcsolja az útvonal vonalának megjelenítését. |
| **Alignment** | Design | A modul igazítása. |
| **Path Color** | Design | Az útvonal vonalának színe. |
| **Path Width** | Design | Az útvonal vonalának vastagsága. |
| **Size** | Design | A szöveg mérete. |
| **Rotate** | Design | Az útvonal elforgatása. |
| **Word Spacing** | Design | A szavak közti távolság. |
| **Starting Point** | Design | Hol kezdődjön a szöveg az útvonalon. |

## Szövegforgató (Supreme Text Rotator)

Egy mondat egy részét felváltva más-más kifejezésre cseréli, így figyelemfelkeltő címsort kapsz. 36 animáció közül választhatsz.

| Beállítás | Fül | Mit csinál |
|---|---|---|
| **Rotator Text** | Content | A váltakozó kifejezések listája. |
| **Before Rotator Text** | Content | A forgó rész előtti szöveg. |
| **After Rotator Text** | Content | A forgó rész utáni szöveg. |
| **Rotate Animation** | Content | A váltás animációja (36 közül). |
| **Rotate Speed (in ms)** | Content | A váltás sebessége ezredmásodpercben. |
| **Pause On Hover** | Content | Az egér fölé vitelkor megállítja a váltást. |
| **Change On Click** | Content | Kattintásra vált a következő kifejezésre. |
| **Heading HTML Tag** | Design | A szöveg HTML-címkéje. |
| **Background Color** | Design | Háttérszín külön az előtte lévő, a forgó és az utána lévő szövegre. |
| **Display** | Design | Megjelenítési mód, szintén külön a három részre. |

## Gépelés (Supreme Typing)

Betűnként „legépeli” a megadott szöveget, mint egy írógép, majd letörli, és a következő mondatot kezdi. Beállíthatod a gépelés és a törlés sebességét, a mondatok közti késleltetést, a végtelen ismétlést és a mondatok véletlenszerű sorrendjét.

| Beállítás | Fül | Mit csinál |
|---|---|---|
| **Before Text** | Content | A gépelt rész előtti szöveg. |
| **Typing Text On a New line** | Content | A gépelt szöveg új sorban kezdődik. |
| **After Text** | Content | A gépelt rész utáni szöveg. |
| **After Text On a New line** | Content | Az utána lévő szöveg új sorban kezdődik. |
| **Use Loop** | Content | Végtelenül ismétli az animációt. |
| **Remove Cursor After Completed** | Content | A befejezés után eltünteti a kurzort. |
| **Typing Speed (in ms)** | Content | A gépelés sebessége. |
| **Typing Backspeed (in ms)** | Content | A törlés sebessége. |
| **Back delay (in ms)** | Content | Várakozás a törlés megkezdése előtt. |
| **Use Fade Out** | Content | Törlés helyett elhalványítja a szöveget. |
| **Use Shuffle** | Content | A mondatokat véletlen sorrendben mutatja. |
| **Cursor Character** | Content | A kurzorként használt karakter. |
| **Animate in Viewport** | Content | Mennyire legyen látható a modul, hogy az animáció elinduljon. |
| **Repeat Animation in Viewport** | Content | Minden alkalommal újraindítja, amikor a modul újra láthatóvá válik. |
| **Background Color** | Design | Háttérszín külön az előtte lévő, a gépelt és az utána lévő szövegre. |
| **Display** | Design | Megjelenítési mód, szintén külön a három részre. |
| **Cursor Color** | Design | A kurzor színe. |

Tipp: előbb a **Content** fület töltsd ki, utána a **Design** fület. Ha a méret vagy a betűtípus számít, állítsd be külön a táblagépre és a telefonra is.
