# Termékoldal és termékképek

> A termékoldal kényelmi beállításai, a termékképek méretei és vágása, és a bélyegképek újragenerálása.

A Testreszabó a termékoldal megjelenését és a termékképek méretét is szabályozza. A termékoldal beállításai a használt témától függenek, a képméretek viszont minden témánál ugyanott vannak.

## Termékoldal

Ha a témád támogatja, a **Megjelenés → Testreszabás → WooCommerce → Termékoldal** szakaszban két megjelenítési lehetőséget találsz:

- Tapadó kosárba tevő sáv: egy keskeny sáv a böngészőablak tetején, amely a termék bélyegképét, nevét, árát és a **Kosárba teszem** gombot mutatja. Akkor jelenik meg, amikor a lapozással a termékoldal saját kosárba tevő gombja már kikerült a látómezőből, így a vásárló visszagörgetés nélkül kosárba teheti a terméket.
- Termék lapozó: a boltban előtte és utána álló termék bélyegképe jelenik meg a termékoldal két szélén. A bélyegkép fölé víve az egérrel látszik a termék neve.

> **Megjegyzés**
>
> A Twenty Twenty-Five témával a Testreszabóban ez a szakasz nem jelenik meg, csak a **Termék képek** szakasz. Blokkos témánál a termékoldal kialakítását a webhelyszerkesztő **Egy termék** sablonjában végezheted (lásd a [Termék blokk](https://hub.hellowp.io/hu/manuals/woocommerce/bolt-megjelenese/bolt-megjelenese-termek-blokk/) és a [Termékgaléria blokk](https://hub.hellowp.io/hu/manuals/woocommerce/bolt-megjelenese/bolt-megjelenese-termekgaleria-blokk/) fejezetet).

## Képtípusok a boltban

A boltban három képtípus fordul elő:

- **Katalóguskép:** közepes méretű kép a boltoldalon, a kategóriaoldalakon, valamint a kapcsolódó, a felárazható (up-sell) és a kereszt-értékesítésű (cross-sell) termékeknél.
- **Bélyegkép:** a legkisebb kép. A kosárban, a widgetekben és a termékoldalon a fő kép alatti galériában látható. A galéria opcionális.
- **Fő termékkép:** a legnagyobb, a termék kiemelt képe. Erre a Testreszabó képbeállításai **nem** vonatkoznak: a fő képet és a termékgalériát a termék szerkesztőjében kezeled.

## Termék képek szakasz

A **Megjelenés → Testreszabás → WooCommerce → Termék képek** szakaszban a képek méretét és vágását állítod. A változtatások közzététele után az új képméretek automatikusan létrejönnek.

![A Termék képek szakasz beállításai](./kepek/bolt-megjelenese-termekkepek.webp)

*A Termék képek szakasz beállításai* (https://minta-bolt.hu/wp-admin/customize.php?autofocus[section]=woocommerce_product_images)

A képen a három beállítás látszik: a fő kép szélessége, a bélyegkép szélessége és a bélyegkép vágása.

| Beállítás | Mit csinál | Alapérték |
| --- | --- | --- |
| **Fő kép szélessége** | Az egyedi termékoldalon használt fő kép mérete. A képek vágatlanok maradnak. | 600 |
| **Bélyegkép szélessége** | A katalógusban megjelenő termékeknél használt képméret. | 300 |
| **Bélyegkép vágás** | A bélyegképek vágása, lásd lent. | **1:1** |

A **Bélyegkép vágás** három lehetőséget kínál:

- **1:1:** a képek négyzet formára lesznek vágva.
- **Egyéni:** a képek az általad megadott képarányban lesznek vágva. Ha egy kép nem elég nagy a megadott arányhoz, nem tölti ki teljesen a kijelölt helyet.
- **Vágatlan:** a képek az eredeti képarányban jelennek meg, ezért a katalógusban egyenetlenek lehetnek.

A beállítás menete:

1. Nyisd meg a **Megjelenés → Testreszabás → WooCommerce → Termék képek** szakaszt.
2. Válaszd ki a vágás módját. **Egyéni** esetén add meg az arányt a két mezőben.
3. Az alsó sávban az **Asztali**, **Táblagép** és **Mobil** gombbal nézd meg az eredményt különböző eszközökön is.
4. Kattints a **Közzététel** gombra.

## Bélyegképek újragenerálása

Ha a képek módosítása után a régi méretek maradnak, vagy témát váltottál, újragenerálhatod a bolt bélyegképeit. A **WooCommerce → Állapot → Eszközök** oldalon keresd a **Bolt bélyegképeinek újragenerálása** sort, és kattints az **Újragenerálás** gombra.

![A bélyegképek újragenerálása az Eszközök oldalon](./kepek/bolt-megjelenese-eszkozok.webp)

*A bélyegképek újragenerálása az Eszközök oldalon* (https://minta-bolt.hu/wp-admin/admin.php?page=wc-status&tab=tools)

A művelet újragenerálja az összes bolti előnézeti képet, hogy megfeleljenek a téma és a képbeállítások méreteinek.