# Woo kosár és Woo saját fiók: a kosár- és a fiókoldal szerkesztése

> A WooCommerce kosár és Saját fiók oldal átépítése Elementorban a Woo kosár és a Woo saját fiók widgettel: elrendezések, üres kosár, fülek és ismert korlátozások.

A WooCommerce kosár- és fiókoldala alapból egy kész shortcode-blokk, amelyet témával alig lehet átalakítani. A **Woo kosár** és a **Woo saját fiók** widget ezt oldja fel: megtarthatod a WooCommerce saját működését és átstílusozhatod, vagy részekre bontva építheted fel az oldalt.

Mindkét widget Pro funkció, és a **The Plus Addons → Widgets** oldalon kell bekapcsolni (**Woo kosár**, illetve **Woo saját fiók**). Aktív Elementor és WooCommerce kell hozzájuk.

## A kosároldal szerkesztése (Woo kosár)

Az előnézethez tegyél egy terméket a kosárba, mielőtt megnyitod az oldalt a szerkesztőben, mert üres kosárnál más nézet jelenik meg.

1. Add hozzá a **Woo kosár** widgetet a WooCommerce **Kosár** oldalához rendelt oldalra.
2. Az **Elrendezés** szakaszban válaszd ki az **Elrendezés** értékét.

![A Woo kosár widget panelje az Elrendezés szakasszal](./kepek/woo-builder-kosar-panel.webp)

*A Woo kosár widget panelje az Elrendezés szakasszal* (https://minta-bolt.hu/wp-admin/post.php?post=336&action=elementor)

A képen a **Woo kosár** widget **Tartalom** füle látszik: az **Elrendezés** mező **Alapértelmezett** értéken, alatta a **Kosár tételekkel**, **Üres kosár** és **Extra opciók** szakasz.

Az **Elrendezés** két értéke:

- **Alapértelmezett**: a WooCommerce saját, beépített kosárelrendezése. Akkor jó, ha az eredeti szerkezetet és működést megtartanád, és csak átstílusoznád. A **Stílus** fülön a kosártábla tipográfiáját, a sorok közét, a szegélyek színét, valamint a frissítés és a pénztár gombok színét állíthatod, a WooCommerce kosárszámítását vagy mezősorrendjét nem érinted.
- **Egyéni**: a kosarat ismétlődő elemekből építed fel. Minden elem **Kiválasztás** mezőjében a következők közül választhatsz: **Kosár adatai** (a kosárba tett termékek listája: kép, név, mennyiség, ár és törlés soronként), **Kosár összege** (a részösszeg és végösszeg blokk, szállítással és adóval, ha a WooCommerce-ben be van kapcsolva), **Pénztárgomb** (a Pénztár oldalra vivő gomb). A sorrend szabad, így például a termékek kerülhetnek balra, a végösszeg és a pénztárgomb jobbra.

> **Fontos:** az **Egyéni** elrendezés a szerkesztő előnézetében hibát (végzetes PHP-hibát) okozhat, mert a widget a WooCommerce kosárobjektumát a szerkesztő kérésében még nem létező állapotban hívja. Amíg ez nem javul, használd az **Alapértelmezett** elrendezést és a **Stílus** fület. Ha mégis kipróbálod és az előnézet lefagy, állítsd vissza az **Alapértelmezett** értéket.

### Kosár tételekkel

A **Kosár tételekkel** szakasz kapcsolói azt szabályozzák, mi látszik a kosárban:

![A Kosár tételekkel szakasz kapcsolói](./kepek/woo-builder-kosar-tetelek.webp)

*A Kosár tételekkel szakasz kapcsolói* (https://minta-bolt.hu/wp-admin/post.php?post=336&action=elementor)

A képen a szakasz kapcsolói látszanak: a **Kosár megjelenítése** és a **Kosár végösszegének megjelenítése** be van kapcsolva, a többi elrejtve.

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Kosár megjelenítése** | A kosárba tett termékek listája. | Megjelenítés |
| **Keresztértékesítés megjelenítése** | Keresztértékesítésre szánt termékeket mutat a kosár alatt. | Elrejtés |
| **Kuponopció elrejtése** | Elrejti a kuponmezőt, ha nem akarod, hogy a vásárlók kedvezménykódot alkalmazzanak a pénztárnál. | Elrejtés kikapcsolva (a kuponmező látszik) |
| **Kosár végösszegének megjelenítése** | A részösszeg és a végösszeg. | Megjelenítés |
| **Kosár végösszegének teljes szélessége** | A végösszeg-blokkot teljes szélességűre nyújtja, egyéni vagy keskeny elrendezésben hasznos. | Elrejtés |

### Üres kosár

Üres kosárnál a WooCommerce sima szövege helyett saját ikont és üzenetet mutathatsz, ami az első látogatásoknál gyakori nézet.

![Az Üres kosár szakasz az ikon és az üzenet mezőjével](./kepek/woo-builder-kosar-ures.webp)

*Az Üres kosár szakasz az ikon és az üzenet mezőjével* (https://minta-bolt.hu/wp-admin/post.php?post=336&action=elementor)

A képen az **Üres kosár ikonja** mező **Alapértelmezett** értéken, alatta az **Üres kosár üzenete** mező „A kosarad jelenleg üres.” szöveggel.

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Üres kosár ikonja** | Mi jelenjen meg üres kosárnál: az alapértelmezett ikon, vagy saját feltöltött kép (az egyéni választással). | Alapértelmezett |
| **Üres kosár üzenete** | Az üres kosárnál megjelenő szöveg. | A kosarad jelenleg üres. |

### Mennyiségjelző stílusa

A **Stílus** fülön a **Mennyiségjelző stílusa** vezérli, hogyan néz ki a mennyiséget állító mező minden kosársoron. Így a kosár mennyiségmezője illeszthető az oldal többi beviteli mezőjéhez.

### Mire használd

- A kosároldal betűtípusait és színeit az oldalhoz igazítod.
- A végösszeget és a pénztárgombot a termékek mellé teszed.
- Az üres kosár szövegét saját ikonnal és üzenettel cseréled.
- A mennyiségválasztót a többi űrlapmezőhöz hasonlóvá teszed.

## A Saját fiók oldal szerkesztése (Woo saját fiók)

A **Woo saját fiók** widget a WooCommerce fiókoldalát vagy átstílusozza, vagy fülenként külön elemekre bontja.

1. Add hozzá a **Woo saját fiók** widgetet a WooCommerce **Saját fiók** oldalához rendelt oldalra.
2. Az **Elrendezés** mezőben válassz a **Teljes shortcode** (alapértelmezett) és az **Egyéni** között.

![A Woo saját fiók widget panelje: Teljes shortcode elrendezés és a két stílus](./kepek/woo-builder-fiokom-panel.webp)

*A Woo saját fiók widget panelje: Teljes shortcode elrendezés és a két stílus* (https://minta-bolt.hu/wp-admin/post.php?post=337&action=elementor)

A képen az **Elrendezés** mező **Teljes shortcode** értéken látszik, alatta a **Stílus** két választható előnézettel.

### Teljes shortcode

A teljes fiókoldalt pontosan úgy jeleníti meg, ahogy a WooCommerce alapból teszi. A **Stílus** választóval a teljes irányítópult kinézetét állíthatod: **Stílus 1** (alapértelmezett, vízszintes fülekkel) vagy **Stílus 2** (a fülek egymás alatt).

### Egyéni fülek

Az **Egyéni** elrendezésnél egy ismétlődő listában, a **Fül kiválasztása** mezővel adhatsz hozzá egy-egy fület: **Vezérlőpult** (alapértelmezett), **Rendelések**, **Letöltések**, **Címek** vagy **Fiókadatok**. Annyi elemet adhatsz hozzá, ahány fület külön helyre akarsz tenni az oldalon.

> **Ismert hiba:** a **Letöltések** fül kiválasztása a szerkesztő előnézetében végzetes hibát okoz (a WooCommerce letöltéssablonja feltételezi, hogy a vásárló adatai mindig be vannak töltve, ami a szerkesztő kérésében nem igaz). Egyéni elrendezésnél a **Letöltések** fület addig kerüld. A többi fül nem érintett.

### Előnézet

Az **Előnézet** szakaszban a szerkesztőben választhatod ki, melyik fiókszakasz látszódjon (alapból a **Vezérlőpult**). A **Belépési és regisztrációs űrlap előnézete** kapcsolóval a kijelentkezett látogatóknak szánt belépési és regisztrációs űrlapot is megnézheted a szerkesztőben.

![Az Előnézet szakasz a fiókszakasz választóval és a belépési űrlap kapcsolójával](./kepek/woo-builder-fiokom-elonezet.webp)

*Az Előnézet szakasz a fiókszakasz választóval és a belépési űrlap kapcsolójával* (https://minta-bolt.hu/wp-admin/post.php?post=337&action=elementor)

A képen az **Előnézet kiválasztása** mező **Vezérlőpult** értéken, alatta a **Belépési és regisztrációs űrlap előnézete** kapcsoló kikapcsolva.

| Beállítás | Mit csinál | Alapérték |
|---|---|---|
| **Elrendezés** | **Teljes shortcode** vagy **Egyéni** (fülenként külön elemek). | Teljes shortcode |
| **Stílus** | **Stílus 1** vagy **Stílus 2**. Csak teljes shortcode esetén. | Stílus 1 |
| **Fül kiválasztása** | Melyik fiókfület helyezed el. Csak egyéni elrendezésnél. | Vezérlőpult |
| **Előnézet kiválasztása** | Melyik fiókszakasz látszik a szerkesztőben. | Vezérlőpult |