# „Kosárba” dinamikus link a termék listázási elemében

> WooCommerce-termékek listájában „Kosárba” gomb a Dynamic Link widgettel, WC Product Query lekérdezéssel.

A **Dynamic Link** widget **Add to Cart** forrásával a termékek listájában (és az egyszerű termékek oldalán) „Kosárba” gombot jeleníthetsz meg. Előfeltétel: ingyenes Elementor vagy blokkszerkesztő, aktív WooCommerce és JetEngine, valamint egy bolt-oldalsablon (például JetWooBuilder **Shop Page Template**; helyette JetThemeCore-ral a termékek archívumsablonja is jó, amelybe a Listing Grid kerül).

## 1. A lekérdezés

1. A **JetEngine → Lekérdezéskészítő** oldalon add hozzá az új lekérdezést.
2. Add meg a nevet, a lekérdezés típusa **WC Product Query**.
3. Állítsd be a kívánt szűrőket, és kattints az **Add/Update Query** gombra.

## 2. A listázási elem

1. A **JetEngine → Listázások/komponensek** oldalon kattints az **Új elem hozzáadása** gombra.
2. A **Setup Listing Item** ablakban a forrás legyen **Query Builder**, a lekérdezés az előbb létrehozott, add meg a nevet, a nézet pedig **Elementor** vagy **Blocks (Gutenberg)**. Kattints a **Create Listing Item** gombra.
3. Töltsd fel a tételt widgetekkel (például **Archive Thumbnail**, **Archive Categories**, **Archive Title**, **Archive Price**).
4. Húzz bele egy **Dynamic Link** widgetet, a **Source** legyen **Add to Cart**.
5. A **Label** mezőnél a dinamikus címkék gombbal válaszd a **WooCommerce Product Field** opciót, a beállításoknál pedig az **Add to Cart Text** mezőt.
6. A widget **Advanced** fülén a **CSS Classes** mezőbe írd: `woocommerce`. Így érvényesülnek a WooCommerce „Kosárba” gombjának stílusai.
7. Kattints az **Update** gombra.

## 3. A lista az oldalon

1. Nyisd meg Elementorral a bolt-oldalsablont (vagy az archívumsablont), ahol a listát meg akarod jeleníteni.
2. Tedd az oldalra a **Listing Grid** widgetet, és a **General** fülön válaszd ki a most létrehozott listázási elemet.
3. Kattints az **Update** gombra.

A frontenden minden terméknél megjelenik a WooCommerce-stílusú „Kosárba” gomb.