Árlista widget: stílusok, étlap és Lottie

Az Árlista (angolul Pricing List) widget egy tétel nevét, változatait, árát és leírását jeleníti meg rendezett dobozban. Étlaphoz, szolgáltatáslistához vagy árjegyzékhez jó. A widget a Pro változatban érhető el; az ingyenes bővítményben nincs benne.

Használat előtt kapcsold be: The Plus Addons → Widgets, keress rá a Pricing List szóra, és kapcsold be a kapcsolóját. Az Elementor szerkesztőjében keresd az Árlista widgetet, és húzd az oldalra. Egy widget egy tételt jelenít meg; több tételhez több widgetet tegyél egymás mellé vagy alá.

A stílus kiválasztása

https://minta-bolt.hu/wp-admin/post.php?post=79&action=elementor

Az Elrendezés szakasz Stílus választójában három lehetőség van:

Stílus	Megjelenés
Modern (alap)	Egy doboz: a címkék, a cím, a leírás és az ár egymás alatt.
Egyszerű	A doboz előlapján a címkék, a cím és az ár látszik; a leírás a hátoldalon van, és rámutatáskor a doboz átfordul, hogy megmutassa. Érintőképernyőn koppintásra működik.
Klasszikus	Statikus elrendezés: bal oldalon kép vagy Lottie-animáció, mellette a cím, az ár és a leírás. Nincs átfordulás.

https://minta-bolt.hu/tp-arlista-modern/

A Modern stílusban a címkék (itt a méretek), a cím, a leírás és az ár külön sorban állnak.

A Tartalom szakasz

Beállítás	Mit csinál
Cím	A tétel neve.
Címke	A tétel változatai vagy méretei egyetlen mezőben, a `
Ár	A kiírt ár szövegként, így a pénznemet és a formátumot te adod meg (például 1 990 Ft).
Leírás	A tétel leírása szerkesztővel.

Egyszerű stílus: átfordulás rámutatáskor

https://minta-bolt.hu/tp-arlista-egyszeru/

Az Egyszerű stílus előlapján a címkék, a cím és az ár látszik. Ha az egérrel a dobozra mutatsz, az előlap elfordul, és a hátoldalon a Leírás szövege jelenik meg. A leírás tehát csak rámutatáskor (érintőképernyőn koppintásra) látszik, nem az előlappal együtt.

1. Húzd az Árlista widgetet az oldalra.
2. A Stílus választóban válaszd az Egyszerű lehetőséget.
3. Add meg a Címet, a Címkét és az Árat: ezek az előlapon jelennek meg.
4. Írd meg a Leírást: ez a hátoldalon lesz.

Klasszikus stílus: étlap képpel

Étlaphoz a Klasszikus stílus való, mert minden tétel mellé képet tehetsz.

https://minta-bolt.hu/tp-arlista-klasszikus/

A képen a tétel bal oldalán a kép helye (itt a helyőrző kép), mellette a cím, a változatok, a leírás és jobbra az ár látszik.

1. A Stílus választóban válaszd a Klasszikus lehetőséget.
2. Töltsd ki a Címet, a Címkét, az Árat és a Leírást.
3. A Kép szakaszban az Ikon típusa mezőben hagyd a Kép értéket, és válaszd ki az étel fotóját.
4. Ismételd meg a widgetet minden étlaptételhez.

A Kép szakasz beállításai

https://minta-bolt.hu/wp-admin/post.php?post=79&action=elementor

A Kép szakasz csak a Klasszikus stílusnál jelenik meg.

Beállítás	Mit csinál
Ikon típusa	Kép vagy Lottie. Alapérték: Kép.
Kép	A feltöltött vagy kiválasztott kép (Kép típusnál).
Jobb oldali térköz	A távolság a kép és a szöveg között pixelben; eszközönként állítható.
Képfelbontás, Kép méretei	Az Elementor szokásos képméret-választója.
Kép alakja	A kép alakja: nincs, lekerekített vagy kör.
Lottie URL	A Lottie-animáció címe (Lottie típusnál).

Lottie-animáció a statikus kép helyett

A Klasszikus stílusban a kép helyett animált Lottie-fájlt is használhatsz.

1. Szerezz egy Lottie JSON-fájlt, amely nyilvános webcímen elérhető (például a LottieFiles oldaláról).
2. Az Árlista widgetben a Stílus legyen Klasszikus.
3. A Kép szakaszban az Ikon típusa mezőt állítsd Lottie-ra.
4. A megjelenő Lottie URL mezőbe másold be a JSON-fájl webcímét.

A Lottie-fájlnak nyilvános címen kell lennie: a widgetben nincs fájlválasztó a Lottie-fájlokhoz.

Egyéb opció

Az Egyéb opció szakasz a Klasszikus stílusnál nem jelenik meg. A Doboz igazítása mező a másik két stílusnál más-más lehetőségeket kínál:

Stílus	Lehetőségek	Alapérték
Modern	Bal, Középre, Jobb	Bal
Egyszerű	Bal felső, Jobb felső, Bal alsó, Lent jobbra	Bal alsó

Stílus fül

A Stílus fül külön szakaszokban formázza a címet, az elválasztóvonalat, a címkét, az árat, a leírást, a képet, a hátteret (az előlapét és a hátoldalét külön) és a Lottie-animációt. A színek, a térközök, a szegélyek és a lekerekítések a szokásos Elementor-mezőkkel állíthatók.