# Kívánságlista

> A kívánságlista oldal elkészítése és a három kívánságlista-widget beállításai.

A kívánságlista azokat a termékeket gyűjti össze, amelyeket a látogató megkedvelt. Külön oldalon nézheti meg őket, és onnan közvetlenül a kosárba is teheti a termékeket.

Három widget tartozik hozzá: a **Kívánságlista** (maga a lista), a **Kívánságlista gomb** (a termékeken) és a **Kívánságlista-számláló gomb** (a lista elérése és a termékek száma).

## A kívánságlista oldal elkészítése

1. Hozz létre egy oldalt, például „Kívánságlista” címmel. Használhatsz meglévő oldalt is, például a felhasználói fiók oldalát.
2. Kapcsold be a funkciót a **Crocoblock → JetPlugins Settings → JetCompareWishlist → Kívánságlista beállításai** lapon, és a **Kívánságlista-oldal** mezőben válaszd ki ezt az oldalt (lásd [Beállítások](https://hub.hellowp.io/hu/plugins/jet-compare-wishlist/beallitasok/)).
3. Nyisd meg a termékoldalt a weboldal elülső részén, és a **Hozzáadás a kívánságlistához** gombbal tegyél a listára néhány terméket. A gomb minden termékoldalon megjelenik, ha az **Alapértelmezett kívánságlistagomb hozzáadása** be van kapcsolva.
4. Nyisd meg a kívánságlista oldalát az Elementor szerkesztőjében, keresd meg a **Kívánságlista** widgetet, és húzd az oldalra. A widget az Elementor panelen a **Jet Compare Wishlist** csoportban van.
5. A **Tartalom** lapon állítsd be az általános beállításokat, a **Stílus** lapon pedig az oszlopok, a termékek, a bélyegképek és a többi elem megjelenését.
6. Kattints a **Frissítés** vagy **Közzététel** gombra.

![A kívánságlista oldal a weboldalon](./kepek/kivansaglista-oldal.webp)

*A kívánságlista oldal a weboldalon* (https://minta-bolt.hu/kivansaglista/)

A képen a kívánságlista három termékkel: mindegyik fölött egy kuka ikon van a termék eltávolításához, alatta a név, az ár és a **Kosárba teszem** gomb.

## A Kívánságlista widget

A widget egy külön oldalon használható a legjobban. A **Tartalom** lap **Kívánságlista** szakaszában állíthatod be a lista kinézetét és a megjelenő adatokat.

![A Kívánságlista widget tartalmi beállításai](./kepek/szerkeszto-kivansaglista.webp)

*A Kívánságlista widget tartalmi beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=21&action=elementor)

A képen a widget tartalmi beállításai láthatók az Elementor panelen.

| Beállítás | Mit csinál |
| --- | --- |
| **Termékek előbeállításai** | A termékkártyák előre elkészített elrendezése, **Előbeállítás 1**-től **Előbeállítás 10**-ig. |
| **Oszlopok** | Az oszlopok száma (1 és 6 között). Eszközönként külön is megadható, az Elementor egyedi töréspontjaival is működik. |
| **Azonos oszlopmagasság** | Az oszlopokat egyforma magasságúra állítja. |
| **Üres szöveg** | Az a szöveg, amelyet a látogató akkor lát, ha a kívánságlistája üres. |
| **Cím** | Megjeleníti a termék nevét. Bekapcsolva további beállítások jelennek meg: **HTML-címke**, **Csonkolás típusa** (**Szavak** vagy **Betűk**) és **Hossz**. |
| **Képfelbontás** | A bélyegkép mérete. |
| **Képhivatkozás** | A képre kattintva a termékoldalra jut a látogató. |
| **Képátfedés** | Átfedő réteget tesz a képre. |
| **Kép pozíciója** | A bélyegkép helye: **Alapértelmezett**, **Bal** vagy **Jobb**. |
| **Értékelés** | Megjeleníti a termék értékelését. Az **Ikon** mezőben 14 különböző ikonstílus közül választhatsz. Az értékelés megjelenítéséhez a JetReviews bővítményt is telepíteni és be kell állítani. |
| **Kivonat**, **Kategóriák**, **Címkék**, **Ár**, **Készletállapot**, **SKU**, **Kosárba tétel gomb** | Ezek a kapcsolók azt döntik el, hogy a termék melyik adata látszik a kártyán. |

A **Stílus** lapon az oszlopok, a termékek, a bélyegképek, valamint a cím, az ár, az értékelés, a készletállapot és a többi elem megjelenését állíthatod be.

## A Kívánságlista gomb widget

A **Kívánságlista gomb** egy gomb, amely a terméket a kívánságlistára teszi. Egyedi WooCommerce-sablonokba (egy termék oldala, termékarchívum) húzd be. Ha az alapértelmezett gombot használod, nem kell külön elhelyezned.

![A Kívánságlista gomb widget beállításai](./kepek/szerkeszto-kivansaglista-gomb.webp)

*A Kívánságlista gomb widget beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

A **Tartalom** lapon a gomb két állapotát állíthatod be külön-külön: **Normál** (a hozzáadás előtt) és **Hozzáadva** (a hozzáadás után).

| Beállítás | Mit csinál |
| --- | --- |
| **Ikon** | Megjeleníti az ikont a gombon. Kikapcsolva csak a felirat látszik. |
| **Ikon pozíciója** | Az ikon helye a felirathoz képest: **Bal**, **Felül**, **Jobb** vagy **Alul**. |
| **Ikon** (**Normál** és **Hozzáadva** lapon) | Az **Ikontárból** választott ikon, vagy feltöltött SVG-fájl (**SVG feltöltése**). |
| **Címke** | A gomb felirata az adott állapotban. |
| **Eltávolító gombként használat** | A **Hozzáadva** lapon érhető el. Bekapcsolva ugyanazzal a gombbal el lehet távolítani a terméket a kívánságlistáról. |

## A Kívánságlista-számláló gomb widget

Ez a gomb a kívánságlista oldalára viszi a látogatót, és megmutatja, hány termék van a listán. Elhelyezheted a fejlécben vagy a láblécben is.

![A Kívánságlista-számláló gomb widget beállításai](./kepek/szerkeszto-szamlalo-gomb.webp)

*A Kívánságlista-számláló gomb widget beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=24&action=elementor)

| Beállítás | Mit csinál |
| --- | --- |
| **Címke** | A gomb felirata. |
| **Ikon** | Megjeleníti az ikont. Bekapcsolva a **Pozíció** mezőben megadhatod az ikon helyét (**Bal**, **Felül**, **Jobb**, **Alul**), az **Ikon** mezőben pedig az ikont. |
| **Darabszám** | Megjeleníti, hány termék van a listán. |
| **Üres kifejezések elrejtése** | Elrejti a számlálót, ha a lista üres (a szám 0). |
| **Formátum** | A számláló megjelenési formátuma. A `%s` helyére kerül a darabszám, alapértéke `%s`. |
| **Pozíció** | A számláló helye az ikonhoz képest, például **Jobb felső**. |