# Woo - Pénztár widget

> A WooCommerce pénztároldal átalakítása: egy- és kétoszlopos vagy többlépéses elrendezés, feliratok, bejelentkezés, kupon, stílus és gyakori kérdések.

A **Woo - Pénztár** widget a WooCommerce alapértelmezett pénztároldalát cseréli le egy testre szabható változatra. A widget a pénztár összes mezőjét átveszi a WooCommercetől, te pedig az elrendezést, a feliratokat, a bejelentkezési és a kuponszakaszt, valamint a színeket és a betűtípusokat állíthatod.

A widget a következőket tudja:

- egyoszlopos, kétoszlopos és többlépéses elrendezés,
- „Vissza a kosárhoz” gomb és „további információk” doboz,
- saját feliratok a pénztár részeihez,
- testreszabható bejelentkezési és kuponszakasz,
- szín- és betűtípus-beállítás minden mezőcsoporthoz.

## Előkészületek

A widget csak akkor működik, ha az oldal a WooCommerce pénztároldala. Ezért mielőtt a szerkesztőben dolgozni kezdesz:

1. Hozz létre egy oldalt a pénztárnak (vagy használd a WooCommerce által létrehozottat, itt a **Pénztár** nevűt).
2. Nyisd meg a **WooCommerce → Beállítások → Haladó** fület, és a **Pénztároldal** mezőben válaszd ki ezt az oldalt.
3. Tegyél legalább egy terméket a kosárba. A WooCommerce a pénztároldalt üres kosárral nem jeleníti meg, így a szerkesztőben sem látnád a mezőket.
4. Nyisd meg az oldalt az Elementorral, és húzd rá a **Woo - Pénztár** widgetet.

Ha az oldal nem a WooCommerce-ben kijelölt pénztároldal, a widgetben beállított színek és stílusok nem érvényesülnek az űrlapon.

![A pénztároldal vendégként: kétoszlopos elrendezés, kuponmező, számlázási adatok, rendelés áttekintése és fizetési mód](./kepek/woocommerce-2-penztar-elol.webp)

*A pénztároldal vendégként: kétoszlopos elrendezés, kuponmező, számlázási adatok, rendelés áttekintése és fizetési mód* (https://minta-bolt.hu/penztar/)

A képen a kétoszlopos elrendezés látszik: balra a számlázási adatok és a megjegyzés, jobbra a rendelés áttekintése és a fizetési mód. A legfelső sávban a kuponszakasz hivatkozása látszik.

## Elrendezés

A **Tartalom** fül **Elrendezés** szakaszában döntöd el, hogyan jelenjen meg a pénztár.

![A Woo - Pénztár widget Elrendezés szakasza](./kepek/woocommerce-2-penztar-elrendezes.webp)

*A Woo - Pénztár widget Elrendezés szakasza* (https://minta-bolt.hu/wp-admin/post.php?post=13&action=elementor)

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Elrendezés** | **Egy oszlop**: minden mező egymás alatt, mint a WooCommerce alapnézetében. **Két oszlop**: a számlázási és egyéb adatok az egyik oszlopban, a rendelés áttekintése és a fizetési mód a másikban. **Többlépéses**: a pénztár külön lépésekre oszlik, a látogató egyesével tölti ki őket. | **Két oszlop** |
| **Kosár linkje** | Megjelenik a „Vissza a kosárhoz” gomb, így a látogató a pénztárból könnyen visszamehet módosítani a kosarat. Többlépéses elrendezésnél nem érhető el. | Megjelenítés |
| **Boltba vezető link** | „Vásárlás folytatása” jellegű hivatkozás a bolt oldalára. | Elrejtés |
| **További információk doboza** | Egy megjegyzésmező, ahová a vásárló üzenetet írhat a rendeléshez. | Megjelenítés |

A kétoszlopos elrendezés a kisebb képernyőkön (telefonon, tableten) automatikusan egymás alá kerül.

### Többlépéses pénztár

A többlépéses elrendezés a hosszú pénztárűrlapot rövidebb oldalakra bontja: bejelentkezés, számlázási adatok, szállítási adatok és fizetés. Így a látogatónak egyszerre kevesebb mezőt kell látnia. A lépések közötti lapozó gombok feliratát a **Pénztárcímkék** szakaszban adhatod meg, a megjelenésüket a **Stílus** fülön állíthatod, ahol a lépések fülei külön szakaszt kapnak (**Fülek**).

A szállítási lépést el lehet rejteni, ha a boltodban nincs rá szükség. Ehhez add hozzá a következő sort az aktív téma `functions.php` fájljához (célszerűen gyermektémában):

```php
add_filter( 'uael_multistep_checkout_hide_shipping_step', '__return_true' );
```

## Pénztárcímkék

A **Pénztárcímkék** szakaszban a pénztár részeinek feliratait cserélheted le. A mezők mellett az Elementor dinamikus címkéit is használhatod.

![A Pénztárcímkék szakasz](./kepek/woocommerce-2-penztar-cimkek.webp)

*A Pénztárcímkék szakasz* (https://minta-bolt.hu/wp-admin/post.php?post=13&action=elementor)

| Beállítás | Alapérték (magyar felületen) |
|---|---|
| **Számlázási szöveg** | Számlázási adatok |
| **Szállítási szöveg** | Szállítás más címre? |
| **Rendelési szöveg** | Rendelés áttekintése |
| **Fizetési szöveg** | Fizetési mód |
| **Kosárgomb szövege** | Vissza a kosárhoz |

A **Boltba vezető link** bekapcsolásakor megjelenik a **Bolt link szövege** mező is. Többlépéses elrendezésnél a lapozógombok szövegét az **Előző gomb szövege** és a **Következő gomb szövege** mezők adják.

## Bejelentkezési szakasz

A bejelentkezési szakasz egy hivatkozást tesz a pénztár tetejére, amelyre kattintva a már regisztrált vásárló belépés után folytathatja a vásárlást.

![A Bejelentkezési szakasz beállításai](./kepek/woocommerce-2-penztar-bejelentkezes.webp)

*A Bejelentkezési szakasz beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=13&action=elementor)

| Beállítás | Mit csinál |
|---|---|
| **Cím** | A szakasz felirata, alapértelmezés szerint „Visszatérő vásárló?”. |
| **Hivatkozás szövege** | A hivatkozás szövege, amelyre kattintva a bejelentkezési űrlap kinyílik. |
| **Űrlap szövege** | A bejelentkezési űrlap fölötti tájékoztató szöveg. |

Ez a szakasz csak kijelentkezett látogatónak látszik. A szerkesztésekor ezért lépj ki az oldalról, vagy nyisd meg a pénztároldalt privát (inkognitó) ablakban.

Ha a bejelentkezési hivatkozás ennek ellenére sem jelenik meg, a WooCommerce-ben kell bekapcsolni: **WooCommerce → Beállítások → Fiókok és adatvédelem**, itt pipáld be azt a beállítást, amely lehetővé teszi, hogy a vásárlók a pénztárnál bejelentkezzenek egy meglévő fiókba.

## Kuponszakasz

A kuponszakasz egy kis hivatkozást tesz a pénztárra, amelyre kattintva a vásárló beírhatja a kuponkódját.

![A Kuponszakasz beállításai](./kepek/woocommerce-2-penztar-kupon.webp)

*A Kuponszakasz beállításai* (https://minta-bolt.hu/wp-admin/post.php?post=13&action=elementor)

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Bekapcsolás** | A kuponszakasz megjelenítése vagy elrejtése. | Megjelenítés |
| **Cím** | A kérdés a kuponról. | Van kuponod? |
| **Hivatkozás szövege** | A hivatkozás, amely kinyitja a kuponmezőt. | Kattints ide a kód megadásához |
| **Űrlap szövege** | A beviteli mező fölötti szöveg. | Ha van kuponkódod, alkalmazd alább. |
| **Mező helyőrzője** | A kuponmezőben látszó halvány szöveg. | Kuponkód |
| **Gomb szövege** | A kupon beváltó gombjának felirata. | Kupon alkalmazása |

## Stílus

A **Stílus** fülön a pénztár minden részének színét, betűtípusát, szegélyét, belső margóját és egyéb megjelenését megadhatod.

![A Stílus fül Szakaszok része](./kepek/woocommerce-2-penztar-stilus.webp)

*A Stílus fül Szakaszok része* (https://minta-bolt.hu/wp-admin/post.php?post=13&action=elementor)

A stílusszakaszok:

- **Szakaszok**
- **Címsorok**
- **Beviteli mezők**
- **Rendelés áttekintése**
- **Fizetési mód**
- **Gombok**
- **Mezőellenőrzés és hibaüzenetek**
- **Fülek** (csak többlépéses elrendezésnél)

## Gyakori kérdések

**Bármelyik oldalra rakhatom a Woo - Pénztár widgetet?**
Nem, csak arra az oldalra, amelyet a WooCommerce a pénztároldalnak jelölt ki. Hozz létre egy oldalt, majd a **WooCommerce → Beállítások → Haladó → Oldalbeállítás → Pénztároldal** mezőben válaszd ki.

**Miért nem látszanak a szállítási cím mezői a pénztáron?**
A szállítást a WooCommerce-ben kell bekapcsolni: **WooCommerce → Beállítások → Szállítás → Szállítási zónák**, add hozzá a zónát és állíts be szállítási módot. Ezután a szállítási beállítások között válaszd ki a szállítási célhelyet.

**A widgetben beállított színek és stílusok nem látszanak a pénztáron.**
Ez akkor fordul elő, ha az oldal nincs pénztároldalként kijelölve a WooCommerce beállításaiban. Állítsd be a **WooCommerce → Beállítások → Haladó → Oldalbeállítás → Pénztároldal** mezőben.

**Hogyan készíthetek egyedi pénztároldalt?**
A widget elrendezés-, bejelentkezési, kupon- és stílusbeállításaival a WooCommerce alapértelmezett pénztára a weboldalad arculatához igazítható.

**Hogyan lesz többlépéses a pénztár?**
Válaszd az **Elrendezés** beállításnál a **Többlépéses** értéket. A pénztár mezői bejelentkezés, számlázás, szállítás és fizetés lépésekre oszlanak, ami lerövidíti az űrlapot. A lépések megjelenését a **Stílus** fülön állíthatod.

**Hogyan rejthetem el a szállítási lépést a többlépéses pénztárból?**
Használd a fent leírt `uael_multistep_checkout_hide_shipping_step` szűrőt.