# Elmosódott termékképek javítása

> Miért néznek ki elmosódottan a termékképek, hogyan találod meg a téma képméreteit, és hogyan állítsd be és generáld újra a bélyegképeket.

Az elmosódott termékképeket általában az okozza, hogy a téma olyan méretben jeleníti meg a képet, amelyhez a feltöltött kép túl kicsi, vagy a WooCommerce képméret-beállításai túl alacsonyak. Ez a fejezet megmutatja, hogyan állapítsd meg a helyes méreteket, hogyan javítsd a beállításokat, és hogyan generáld újra a bélyegképeket.

Témaváltás vagy képméret-módosítás után mindig újra kell generálni a korábban létrehozott bélyegképeket: **WooCommerce → Állapot → Eszközök**, itt a **Bolt bélyegképeinek újragenerálása** sornál kattints az **Újragenerálás** gombra.

## A három termékképtípus

A WooCommerce háromféle képet használ, mindegyiket más méretben jeleníti meg:

| Típus | Hol látszik |
| --- | --- |
| Egyedi termékkép | A termék oldalán a legnagyobb kép (főkép vagy kiemelt kép). |
| Katalóguskép | Közepes méretű kép a terméklistákban: bolt oldal, kategóriaoldalak, kapcsolódó termékek, felár- és kiegészítő ajánlatok. |
| Termékbélyegkép | A legkisebb kép: kosár, widgetek, a termékgaléria képei a főkép alatt. |

A feltöltött kép a beállított értékekhez igazodva átméreteződik. Ha például 100×100 képpont a beállítás, és 300×600 képpontos képet töltesz fel, a WooCommerce 100×200 képpontosra kicsinyíti. Be is kapcsolhatod a kemény vágást: ilyenkor a kép pontosan a megadott méretű lesz, a rendszer levágja a felesleget ahelyett, hogy torzítaná.

A képméret-beállítások klasszikus témáknál a **Megjelenés → Testreszabás → WooCommerce → Termékképek** helyen vannak. Blokkos témánál (például a Twenty Twenty-Five) nincs Testreszabás: a **Megjelenés → Szerkesztő** felületen, a megfelelő sablonban vagy sablonrészben állítod a képméretet, a részleteket a téma leírása adja.

## A feltöltött kép ellenőrzése

1. Nyisd meg a **Média** könyvtárat, és kattints az egyik termékképre.
2. A **Mellékletrészletek** panelen nézd meg a méreteket. A legtöbb témához az eredeti képnek legalább 800×800 képpontosnak kell lennie.
3. Ha kisebb, cseréld le nagyobb felbontásúra: töröld véglegesen, majd tölts fel újat a **Média → Új hozzáadása** oldalon.
4. A terméket szerkesztve rendeld hozzá újra az új képet kiemelt képként.
5. Ellenőrizd, hogy a termékkép-beállítások egyeznek-e a téma által megjelenített legnagyobb mérettel vagy nagyobbak annál (lásd lent).
6. A feltöltés vagy a beállítás módosítása után generáld újra a bélyegképeket (**WooCommerce → Állapot → Eszközök**).

## A téma képméreteinek kiderítése

A téma határozza meg, mekkora méretben jelenik meg a kép, ezért ezt kell megtudnod, mielőtt beállítod a WooCommerce-et. A böngésző fejlesztői eszközével nézd meg a megjelenített méreteket:

1. Nyisd meg a bolt oldalt a böngészőben. (Sok témánál itt a legnagyobb a katalóguskép.)
2. Kattints jobb gombbal egy termékképre, és válaszd a **Vizsgálat** (angol böngészőben **Inspect**) menüpontot.
3. Olvasd le a fejlesztői panelen a kép méretét.

Ugyanígy nézd meg a termék oldalán az egyedi termékképet, majd a galéria bélyegképét. A Storefront témánál például a katalóguskép 324×324, a termékkép 800×800 (a nagyítás miatt kell ekkora, még ha látszólag kisebb is), a bélyegkép 46×46 képpont.

## A beállítások módosítása

1. Klasszikus témánál nyisd meg a **Megjelenés → Testreszabás → WooCommerce → Termékképek** helyet.
2. A **Főkép szélessége** értékét állítsd a téma által megjelenített legnagyobb mérettel egyenlőre vagy nagyobbra.
3. Kattints a **Közzététel** gombra.
4. Generáld újra a bélyegképeket a **WooCommerce → Állapot → Eszközök** oldalon.

Az új feltöltések az új beállításokat használják, a korábbiak az újragenerálás után frissülnek.

## Retina és nagy felbontású kijelzők

A nagy pixelsűrűségű (retina) kijelzőkön kétszer annyi képpont van, ezért az éles képhez a bélyegképeket a téma által megjelenített méret kétszeresére állítsd. Ha a téma 80×80 képpontban jeleníti meg a képet, a beállítás legyen 160×160. A nagyobb képek lassabban töltődnek be, ezért döntés előtt nézd meg az analitikában, milyen eszközökről és képernyőméretekről érkeznek a vásárlóid.

## Ami a WooCommerce 3.3 óta alapból működik

- A téma-inkompatibilitásból vagy felülíró kódból eredő elmosódás nem fordulhat elő.
- A főképek szélességét és magasságát te szabályozod.
- A bélyegképek átméretezése automatikus vagy kézi lehet.
- A vásárlók alapból helyesen látják a képeket.