# Üzenetdoboz (Message Box) widget: leírás, sablon és bezáró gomb

> Az Üzenetdoboz widget beállításai, a leírás mező használata sablon shortcode-jával, és a bezáró gomb beállítása.

A **Message Box** (üzenetdoboz) widget feltűnő üzenetet, figyelmeztetést vagy értesítést tesz az oldalra: például akciót, ajánlást vagy bármilyen rövid információt. A widget az ingyenes bővítményben is elérhető.

Használat előtt kapcsold be: **The Plus Addons → Widgets**, keress rá a **Message Box** szóra, és kapcsold be a kapcsolóját. Az Elementor szerkesztőjében a **Message Box** nevet keresd.

A panel felirata ennél a widgetnél angol maradt, ezért a fejezet az angol feliratokat használja.

## Az üzenetdoboz felépítése

![A Message Box widget Content szakasza a leírással](./kepek/dobozok-gombok-2-uzenetdoboz-panel.webp)

*A Message Box widget Content szakasza a leírással* (https://minta-bolt.hu/wp-admin/post.php?post=88&action=elementor)

A képen a **Title** mező és a bekapcsolt **Description** kapcsoló látszik, alatta a szerkesztővel.

1. Húzd a **Message Box** widgetet az oldalra.
2. A **Content** szakaszban írd be a **Title** mezőbe a doboz címét.
3. Ha leírást is szeretnél, kapcsold be a **Description** kapcsolót, és írd meg a szöveget a megjelenő szerkesztőben.
4. Az **Icon & Button** szakaszban kapcsold be a **Main Icon** kapcsolót, ha ikont szeretnél a dobozban, és válaszd ki az ikont.
5. Ugyanitt a **Close Button** kapcsolóval bezáró gombot adhatsz a dobozhoz (lásd lent).

![Az Icon & Button szakasz a Main Icon és a Close Button kapcsolóval](./kepek/dobozok-gombok-2-uzenetdoboz-panel-ikon.webp)

*Az Icon & Button szakasz a Main Icon és a Close Button kapcsolóval* (https://minta-bolt.hu/wp-admin/post.php?post=88&action=elementor)

A képen a szakasz két kapcsolója látszik; mindkettő mellett egy szerkesztés ikon nyitja az ikonválasztót.

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Title** | A doboz címe. | This is alert need your attention |
| **Description** (kapcsoló és szerkesztő) | Leírás a cím alatt, formázható szerkesztővel. | Ki |
| **Main Icon** (kapcsoló és ikonválasztó) | A dobozban megjelenő ikon. | Be |
| **Close Button** (kapcsoló és ikonválasztó) | Bezáró gomb a dobozon. | Be |
| **Closing Animation Duration** | A bezáródás animációjának ideje ezredmásodpercben; minél kisebb a szám, annál gyorsabban záródik. | nincs megadva |

![A kész üzenetdoboz cím és leírás megjelenítésével](./kepek/dobozok-gombok-2-uzenetdoboz.webp)

*A kész üzenetdoboz cím és leírás megjelenítésével* (https://minta-bolt.hu/tp-uzenetdoboz/)

A kép a közzétett oldalt mutatja a címmel és a formázott leírással.

A **Stílus** fülön külön szakasz van a címnek, a leírásnak, a főikonnak, a bezáró gombnak és a háttérnek: mindegyikhez betűtípus, szín és rámutatási hatás tartozik. A **Haladó** fül beállításai itt is ugyanazok, mint minden widgetnél.

## Figyelmeztető doboz (alert box) készítése

A widget figyelemfelkeltő értesítőnek is használható: akcióhoz, tájékoztatáshoz vagy interaktív oldalrészhez. A fenti lépések adják az alapot:

1. Add az oldalhoz a **Message Box** widgetet.
2. A **Title** mezőbe írd be az értesítés címét.
3. A **Description** kapcsolóval kapcsold be a leírást, és írd meg a szöveget.
4. Az **Icon & Button** szakaszban adj hozzá ikont (**Main Icon**) és bezáró gombot (**Close Button**).

Az eredmény egy kész figyelmeztető doboz, amelynek címe, leírása, ikonja és bezáró gombja van.

## A leírás mező: formázás és sablon

A **Description** mező valódi szerkesztő: a beillesztett HTML, például a félkövér szöveg, a közzétett oldalon pontosan úgy jelenik meg, ahogy megírtad, nem egyszerű szövegként.

Ennek köszönhetően az üzenetdoboz leírásába Elementor-sablont is tehetsz. A widgetnek nincs saját sablonválasztója, ezért a sablon shortcode-ját kell beillesztened:

1. Nyisd meg a **Sablonok → Mentett sablonok** oldalt, és hozz létre egy új sablont (vagy importálj egyet), amelyben megtervezed a doboz tartalmát, majd mentsd el.
2. Szerezd meg a sablon shortcode-ját. Elementor Pro-val ez a sablon saját shortcode-ja, Pro nélkül az ingyenes Anywhere Elementor bővítmény adja.
3. Add az oldalhoz a **Message Box** widgetet, kapcsold be a **Description** kapcsolót, és illeszd be a shortcode-ot a leírás mezőbe.

### Hibaelhárítás: a shortcode szövegként jelenik meg

Nézd meg, hogy a shortcode-ot adó bővítmény (Elementor Pro vagy Anywhere Elementor) aktív-e, és hogy a sablon közzé van-e téve, nem csak vázlat.

## Bezáró gomb

Az üzenetdoboz bezáró gombja a látogató számára eltávolítja a dobozt, ha már elolvasta.

1. Az **Icon & Button** szakaszban kapcsold be a **Close Button** kapcsolót.
2. Válaszd ki a bezáró ikont az ikonválasztóval (feltölthetsz saját képet is).
3. Állítsd be a **Closing Animation Duration** értékét: például 500 ezredmásodpercnél a doboz gyorsan, 2500-nál lassan záródik be.

Kattintás előtt a doboz teljes tartalma (cím, leírás, ikon) látszik. A bezáró ikonra kattintva a doboz tartalma a beállított idő alatt ténylegesen eltűnik az oldalról, nem csak elhalványul.

### Korlátozások és hibaelhárítás

- A bezárt doboz az oldal újratöltéséig nem tér vissza, külön „újranyitás” vezérlő nincs.
- Ha az ikonra kattintva semmi sem történik, ellenőrizd, hogy a **Close Button** kapcsoló be van-e kapcsolva (nem elég kiválasztani egy ikont), és hogy van-e kiválasztott ikon: ikon nélkül nincs mire kattintani.