# Termékoldal építése: Woo egyszerű termékoldal, termékár, termékfülek és termékképek

> Az egyedi WooCommerce termékoldal összeállítása négy widgetből: alapadatok, ár és kosárgomb, fülek, képgaléria.

A WooCommerce termékoldalának elrendezését alapból a téma szabja meg: az árat nem tudod a galéria fölé tenni, a füleket nem bonthatod külön szakaszokra. Négy widget együtt lehetővé teszi, hogy a termékoldalt elemenként, tetszőleges sorrendben építsd fel Elementorban:

- **Woo egyszerű termékoldal**: a termék alapadatai (cím, rövid leírás, akciós jelvény, értékelés, előző/következő termék).
- **Woo termékár**: a vásárláshoz kapcsolódó elemek (kosárba gomb, ár, készlet, eladott darabszám, tulajdonságok).
- **Woo termékfülek**: a leírás, a további információk és az értékelések fülei.
- **Woo termékképek**: a termék képgalériája.

Mind a négy Pro funkció, a **The Plus Addons → Widgets** oldalon külön-külön kell bekapcsolni (név szerint keresve). Aktív Elementor és WooCommerce kell hozzájuk, az előnézethez pedig legalább egy közzétett termék.

## Woo egyszerű termékoldal

Az elemeket ismétlődő listában adod meg, mindegyiket külön hozzáadva, tetszőleges sorrendben. A választható elemek: a **cím** (az alapértelmezett), a **rövid leírás**, az **akciós jelvény**, az **értékelés** és az **előző/következő termék** navigáció. A panelen a lista elemei a belső nevükön látszanak (`title`, `short_description`, `sale_badge`, `rating`, `next_previous_product`). Az **Elem hozzáadása** gombbal újat vehetsz fel, a másolás és törlés ikonokkal rendezheted a sorokat. Az **Igazítás** az egész widget vízszintes helyét adja.

![A Woo egyszerű termékoldal widget elemlistája](./kepek/woo-builder-2-termek-alap-panel.webp)

*A Woo egyszerű termékoldal widget elemlistája* (https://minta-bolt.hu/wp-admin/post.php?post=349&action=elementor)

A képen az öt alapelem látszik a másolás és törlés ikonokkal, alattuk az **Elem hozzáadása** gomb és az **Igazítás**.

## Woo termékár

Ez a widget a vásárláshoz kapcsolódó elemeket kezeli, külön ismétlődő listában: **kosárba** gomb (alapértelmezett), **ár**, **készlet**, **eladott darabszám** és **tulajdonságok** (a változatválasztók). A listában ezek a belső nevükön szerepelnek (`add_to_cart`, `price`, `stock`, `sold`, `attributes`).

![A Woo termékár widget elemlistája](./kepek/woo-builder-2-termek-ar-panel.webp)

*A Woo termékár widget elemlistája* (https://minta-bolt.hu/wp-admin/post.php?post=350&action=elementor)

A képen az öt elem látszik, alattuk az **Elem hozzáadása** gomb és az **Extra opciók** szakasz.

Az **Extra opciók** szakaszban egyetlen kapcsoló van: **Kosárba helyezés: készleten lévő állapot**. Alapból ki van kapcsolva (**Elrejtés** állásban).

![A Woo termékár Extra opciók szakasza](./kepek/woo-builder-2-termek-ar-extra.webp)

*A Woo termékár Extra opciók szakasza* (https://minta-bolt.hu/wp-admin/post.php?post=350&action=elementor)

A képen a **Kosárba helyezés: készleten lévő állapot** kapcsoló látszik.

## Woo termékfülek

Az **Elrendezés** mezőben két változat közül választasz: **Fülek** (alapértelmezett, a klasszikus fülsor a leírás, a további információk és az értékelések füleivel) vagy az egyedi elrendezés, amelyben az egyes füleket külön elemként, tetszőleges helyre teheted. A **Fülek** elrendezésnél a **Stílus** mezőben négy előnézeti kártya közül választhatsz.

![A Woo termékfülek widget elrendezés- és stílusválasztója](./kepek/woo-builder-2-termek-fulek-panel.webp)

*A Woo termékfülek widget elrendezés- és stílusválasztója* (https://minta-bolt.hu/wp-admin/post.php?post=351&action=elementor)

A képen az **Elrendezés** mező **Fülek** értéken, alatta a négy **Stílus** kártya, az első kijelölve.

## Woo termékképek

Az **Elrendezés** mezőben a galéria típusát választod, alapértelmezetten **Képgaléria**. A **Stílus** két kártyája: az első egyszerű, rögzített rácsú galéria (egy nagy kép és alatta a bélyegképek), a második rugalmas, egyéni elrendezést ad átméretezhető elemekkel és videótámogatással. Az **Elrendezés** alatti leírás szerint az egyszerű változat akkor jó, ha csak egy kiemelt képet szeretnél megjeleníteni.

A **Bélyegkép elrejtése** kapcsoló (alapból kikapcsolva) eltünteti a bélyegképeket, a **Bélyegkép pozíciója** mezővel pedig megadhatod, hol jelenjenek meg (alapértelmezés: **Alapértelmezett**).

![A Woo termékképek widget panelje](./kepek/woo-builder-2-termek-kepek-panel.webp)

*A Woo termékképek widget panelje* (https://minta-bolt.hu/wp-admin/post.php?post=352&action=elementor)

A képen az **Elrendezés** mező **Képgaléria** értéken, alatta a két **Stílus** kártya, a **Bélyegkép elrejtése** kapcsoló és a **Bélyegkép pozíciója** mező.

## Beállítások összefoglalva

| Widget | Fő beállítás | Alapérték |
|---|---|---|
| **Woo egyszerű termékoldal** | Az elemek ismétlődő listája | Cím |
| **Woo termékár** | Az elemek ismétlődő listája | Kosárba gomb |
| **Woo termékfülek** | **Elrendezés** | Fülek |
| **Woo termékképek** | **Elrendezés** | Képgaléria |