# Árdoboz widget

> Csomagok bemutatása árral, funkciólistával és gombbal: dobozstílusok, szalagok, ár megjelenítése és a funkciók elrendezése.

Az **Árdoboz** widgettel termék- vagy szolgáltatáscsomagot mutathatsz be: cím, ár, funkciólista és felhívás cselekvésre (gomb) egyetlen dobozban. Kész dobozstílusok, szalagok és rámutatáskor lejátszott animációk segítenek, hogy a csomag kiemelkedjen.

Ha a widget nem látszik a szerkesztőben, kapcsold be a bővítmény **Widgetek** beállításainál.

A **Tartalom** fül szakaszai: **Előbeállítások**, **Általános**, **Címsor**, **Árazás**, **Tartalom**, **Eszköztipp**, **Felhívás cselekvésre**, **Szalag** és **Hasznos információk**. A **Stílus** fülön ugyanezekhez van külön szakasz (**Címsor**, **Árazás**, **Leírás**, **Tartalom**, **Eszköztipp**, **Felhívás cselekvésre**, **Elválasztó**, **Szalag**).

## A doboz stílusa és az animáció

Az **Általános** szakaszban két beállítás van:

![Az Árdoboz Általános szakasza a Stílus és a Rámutatáskor megjelenő animáció listával](./kepek/tartalom-arak-gombok-ardoboz-altalanos.webp)

*Az Árdoboz Általános szakasza a Stílus és a Rámutatáskor megjelenő animáció listával* (https://minta-bolt.hu/wp-admin/post.php?post=27&action=elementor)

A képen a **Stílus** alapértéke **Normál**, az animációé **Nincs**.

A **Stílus** határozza meg, milyen sorrendben követik egymást a doboz részei:

| Stílus | A doboz részeinek sorrendje |
|---|---|
| **Normál** | Címsor, ár, tartalom (funkciók), felhívás cselekvésre |
| **Jellemzők alul** | Címsor, ár, felhívás cselekvésre, tartalom (funkciók) |
| **Kör alakú háttér az árhoz** | Címsor, ár (kör alakú háttéren), tartalom (funkciók), felhívás cselekvésre |
| **Ár a CTA felett** | Az ár közvetlenül a felhívás cselekvésre gomb fölött áll |

A **Rámutatáskor megjelenő animáció** listában négy érték van: **Nincs**, **Lebegőpontos szám**, **Süllyedés** és **Függőleges imbolygás**. Az animáció akkor játszódik le, amikor a látogató a dobozra viszi az egeret.

## Az ár megjelenítése

Az **Árazás** szakaszban adod meg az árat és a formátumát.

![Az Árdoboz Árazás szakasza](./kepek/tartalom-arak-gombok-ardoboz-arazas.webp)

*Az Árdoboz Árazás szakasza* (https://minta-bolt.hu/wp-admin/post.php?post=27&action=elementor)

A képen az **Ár** (49.99), a **Pénznem szimbóluma**, a **Pénznem formátuma** és az **Időtartam** mezők látszanak.

| Beállítás | Mit csinál |
|---|---|
| **Ár** | Az ár számjegyekkel. Szöveget is írhatsz, például azt, hogy INGYENES. |
| **Kedvezmény kínálása?** | Bekapcsolva az eredeti ár is megadható a kedvezményes ár mellett. |
| **Pénznem szimbóluma** | **Nincs**, vagy egy lista pénznemekkel (dollár, euró, font, jen és mások), illetve **Egyéni** szimbólum. |
| **Pénznem formátuma** | **Raised** (emelt) vagy **Normal** (normál), lásd alább. |
| **Időtartam** | Az árhoz tartozó időszak szövege, például „Havi”. |
| **Időtartam pozíciója** | **Alul** vagy **Mellett**. |

### Normál és emelt pénznemformátum

**Normál** formátumnál a pénznem szimbóluma, az egész rész és a tört rész egy sorban áll. **Emelt** (Raised) formátumnál a tört rész és a pénznem szimbóluma külön, kisebb betűvel jelenik meg az egész rész felső, középső vagy alsó részén. A 49.99 esetén például a 99 áll az 49 mellett, a megadott függőleges helyzetben.

A tört rész függőleges helyzetét (fent, középen vagy lent) a **Stílus** fül **Árazás** szakaszában a tört részre vonatkozó beállítás adja meg. A szimbólum helye is ott állítható. A szám és a szimbólum további stílusbeállításai szintén az **Árazás** szakaszban vannak.

## Szalag

A **Szalag** szakasz a doboz sarkában jelenít meg szalagot, amely a legjobb ajánlatot, a kedvezményt vagy a kiemelt csomagot hívja fel.

![A Szalag szakasz Stílus listája](./kepek/tartalom-arak-gombok-ardoboz-szalag.webp)

*A Szalag szakasz Stílus listája* (https://minta-bolt.hu/wp-admin/post.php?post=27&action=elementor)

A **Stílus** lista értékei: **Sarokszalag**, **Kör alakú szalag**, **Zászló alakú szalag** és **Nincs** (ez az alapérték). A szalag színét, méretét és szövegét a **Stílus** fül **Szalag** szakasza állítja.

## A funkciók listájának elrendezése

A **Tartalom** szakaszban a funkciók, szolgáltatások, részletek listáját állítod össze: minden új tételhez kattints az **Elem hozzáadása** gombra. A tételekhez ikon és eszköztipp is megadható.

A lista megjelenését a **Stílus** fül **Tartalom** szakasza határozza meg.

![Az Árdoboz Stílus fülének Tartalom szakasza](./kepek/tartalom-arak-gombok-ardoboz-stilus-tartalom.webp)

*Az Árdoboz Stílus fülének Tartalom szakasza* (https://minta-bolt.hu/wp-admin/post.php?post=27&action=elementor)

A képen az **Elrendezés** lista látszik, alatta a háttérszín, a szegély és a **Funkciók listája** beállításai.

Az **Elrendezés** négy értéke:

- **Egyszerű**: alap lista;
- **Elválasztó a mezők között**: a tételeket vonal választja el;
- **Dobozos elrendezés**: az egész tartalom egy dobozban áll, a tételek között elválasztóval;
- **Csíkozott elrendezés**: a páros és a páratlan sorok külön színt kapnak.

A **Funkciók listája** alatt az ikon térközét, méretét és színét, a szöveg színét és tipográfiáját, a tétel belső margóját és az igazítást állíthatod.