# Témák és mezők: ismert problémák

> Divi, Avada, Porto és Rey téma beállításai, hiányzó képek a lusta betöltés miatt, hosszú állapotmező-címke.

## Hiányzó képek: lusta betöltés

Ha a pénztáron, a fizetési oldalon (order pay) vagy a köszönőoldalon hiányoznak a képek, valószínűleg a téma lusta betöltése (lazy loading) be van kapcsolva. A CheckoutWC a teljesítmény és a kompatibilitás miatt a téma minden JavaScript- és CSS-fájlját kizárja a pénztároldalakról, így a téma lusta betöltője sem fut le.

**Megoldás:** kapcsold ki a téma saját lusta betöltését. A WordPress az 5.5-ös verziótól beépítetten tud lusta betöltést (a `loading=lazy` attribútummal, JavaScript nélkül), az 5.7-től az iframe-ekre is. A CheckoutWC ezt támogatja, és a legtöbb téma engedi a WordPress saját megoldását, ha a sajátját kikapcsolod.

A beépített megoldás hátránya, hogy a Safari egy ideig nem támogatta. Ha a Safari-támogatás nálad fontos, használj önálló lusta betöltő bővítményt (például a Rocket Lazy Load-ot) a téma funkciója helyett, mert az nem ütközik a CheckoutWC korlátozásával.

## Divi téma

A Divi olyan CSS-t is betölthet a pénztárra, amely főleg mobilon zavar. A javítás a Divi beállításaiban van: kapcsold ki a **Dynamic CSS** és a **Load Dynamic Stylesheet In-line** lehetőséget.

## Avada téma

Az Avadát két beállítással kell hozzáigazítani. Az **Avada → Options** oldalon, a beállításkeresővel:

1. Keresd meg a **WooCommerce One Page Checkout** beállítást, és kapcsold **Off** állásba.
2. Keresd meg a **CSS Compiling Method** beállítást, és állítsd **Disabled** értékre.
3. Keresd meg az **Enable JS Compiler** beállítást, és kapcsold **Off** állásba. A mai szerverek többsége HTTP/2-t használ, ezért a JS- és CSS-fájlok összefűzése rontja a teljesítményt.
4. Mentsd a beállításokat.

## Porto téma

A CheckoutWC jól működik a Portóval, de egy beállítás gondot okoz: a JavaScript- és stíluslapfájlok összefűzése. HTTP/2 mellett az egyesítés lassít, mert a böngésző több kis fájlt párhuzamosan gyorsabban tölt le, mint egy nagyot.

Ha a pénztáron JavaScript-hibák miatt nem tölt be az oldal:

1. Nyisd meg a **Porto → Speed Optimization Wizard → Advanced** oldalt.
2. Vedd ki a pipát a **Merge javascripts and stylesheets** lehetőségből.
3. Kattints a **Save & Continue** gombra.

## Rey téma

A Rey téma a pénztároldal fölé saját folyamatjelző sávot tesz, amit a CheckoutWC mellett általában el kell távolítani. Ezt egy PHP-kódrészlettel lehet elérni, amelyet a CheckoutWC beállításai között a PHP-kódrészletek részbe írhatsz; ha ez nálad nem érhető el, használhatsz kódrészlet-kezelő bővítményt is (például a Code Snippets-et). A kódrészletek kezeléséről lásd: [PHP kódrészletek](https://hub.hellowp.io/hu/plugins/checkout-for-woocommerce/fejlesztoknek-php-kodreszletek/).

## Elementor: törött elrendezés és üzleti szabályzatok

Ez a rész csak a CheckoutWC 8.x és régebbi változataira vonatkozik, a 9.0-tól nincs szükség a javításra.

Ha a pénztároldalt korábban Elementorral készítetted, és a **CheckoutWC → Oldalak → Pénztár** oldalon beállítottál üzleti szabályzatokat, két hiba jelentkezhet:

1. törik az oldal elrendezése,
2. egy szabályzatra kattintva az előugró ablakban a pénztároldal tartalma jelenik meg.

A hibát az Elementor okozza. A megoldás, hogy a pénztároldalt újra létrehozod egyszerű oldalként.

1. Nyisd meg az **Oldalak** listát, keresd meg a jelenlegi pénztároldalt, és írd át a webcímét (slug) valami másra, például `penztar-bak`. Ha nem akarod megtartani, a lomtárba is teheted és véglegesen törölheted; ekkor a 3. lépéssel folytasd.
2. Állítsd az oldal állapotát **Piszkozat**ra.
3. Hozz létre új oldalt, amelynek az egyetlen tartalma ez a rövidkód:

   ```text
   [woocommerce_checkout]
   ```

4. Nyisd meg a **WooCommerce → Beállítások → Haladó** oldalt, és az új oldalt add meg pénztároldalként.
5. Mentsd a beállításokat.

### Elementor stílusok és szkriptek a pénztáron

Ha az Elementor Pro fejlécét és láblécét szeretnéd használni a CheckoutWC-vel, ahhoz a téma fejlécének és láblécének használatát leíró beállítás a mérvadó, lásd: [Fejléc és lábléc](https://hub.hellowp.io/hu/plugins/checkout-for-woocommerce/beallitasok-fejlec-lablec/).

## OceanWP: üres oldalsó kosár

**Tünet:** az OceanWP-vel a termék kosárba tétele után az oldalsó kosár üres marad.

**Ok:** az OceanWP saját AJAX-os kosárba tétele nem küldi el megfelelően a kosár töredékeit az eseménykezelőknek.

**Megoldás:**

1. Nyisd meg a **CheckoutWC → Oldalsó kosár** oldalt, és az **AJAX kosárba helyezés engedélyezése** jelölőnégyzetet jelöld be. Mentsd a beállítást.

   ![Az Oldalsó kosár oldal Beállítások szakasza az AJAX kosárba helyezés engedélyezése jelölőnégyzettel](./kepek/hibaelharitas-oceanwp-ajax.webp)

   *Az Oldalsó kosár oldal Beállítások szakasza az AJAX kosárba helyezés engedélyezése jelölőnégyzettel* (https://minta-bolt.hu/wp-admin/admin.php?page=cfw-settings-side-cart)

   A képen a **Beállítások** szakasz második jelölőnégyzete az **AJAX kosárba helyezés engedélyezése**.

2. Nyisd meg a **Megjelenés → Testreszabás → WooCommerce → Single Product** oldalt, vedd ki a pipát az OceanWP **Enable AJAX Add To Cart** beállításából, és kattints a **Közzététel** gombra.

Ezután a termékeket a CheckoutWC teszi a kosárba az OceanWP helyett, és minden rendben működik.

## Astra Pro: törött elrendezés

Astra Pro mellett előfordulhat, hogy a CheckoutWC sablonjai csak akkor jelennek meg rendesen, ha a pénztár elrendezését alapértelmezettre állítod. A beállítás: **Megjelenés → Testreszabás → WooCommerce → Checkout**, ott a **Checkout Layout** értéke legyen **Default**.

## Woostify: ütköző AJAX-os kosárba tétel

A Woostify saját AJAX-os kosárba tevő szkriptje ütközik a CheckoutWC oldalsó kosarával. (Ha nem használod az oldalsó kosarat, ez a rész nem érint.)

Az ütközés elkerüléséhez kapcsold ki a Woostify **Ajax Single Add to Cart** beállítását: **Megjelenés → Testreszabás → WooCommerce → Product Single → General → Ajax Single Add to Cart**.

## Hosszú állapotmező-címke

Néhány nyelven az állapot (megye) mező címkéje olyan hosszú, hogy nem fér el a mezőben. Ez a szöveg a WooCommerce magjából jön, nem a CheckoutWC-ből.

- **Legjobb megoldás:** írd át a fordítást a fordítóbővítményeddel (például a Loco Translate-tel).
- **Kóddal:** ha nem akarsz fordítóbővítményt telepíteni egyetlen szöveg miatt, kétféleképpen segíthetsz: megváltoztatod a címmezők elrendezését, vagy kötelezővé teszed az állapot mezőt, hogy a címkéből elmaradjon az „(optional)” szöveg. Ezek közül csak az egyiket használd, és a kódrészletet a CheckoutWC PHP-kódrészletek részébe írd.