# Szűrők összekötése a szolgáltatókkal egyedi azonosítóval

> A JetSmartFilters szűrők és a szűrhető widgetek (Elementor Pro, JetEngine, JetWooBuilder, WooCommerce, JSF Listing) összekapcsolása Query ID és CSS ID segítségével.

A JetSmartFilters szűrői „szolgáltatókhoz” (provider) kapcsolódnak: ezek azok a widgetek, blokkok és elemek, amelyeket a szűrő átszűr. Minden szolgáltatónál kicsit más a kapcsolás szabálya, de a legtöbbnél ugyanaz az elv: a szűrőben megadott **Query ID** értékét a szűrt widget **CSS ID** mezőjébe is be kell írni.

Előfeltétel: ingyenes Elementor és aktív JetSmartFilters. A szolgáltatókat előbb be kell kapcsolni: **Smart Filters → Settings → General Settings**. A JetEngine Dynamic Chart, Dynamic Table és Maps widgetjei, valamint a Bricks Query Loop elem is szűrhető, bár nem szerepelnek ebben a felsorolásban.

A szűrőnél mindig ezt a három lépést végezd el:

1. Hozz létre szűrőt, és tedd az oldalra a megfelelő szűrőwidgetet.
2. A szűrőwidgetben válaszd ki a szűrőt, a **This filter for** mezőben a szolgáltatót, és add meg a **Query ID** értéket.
3. A szűrt widgetnél (általában az **Advanced** fülön, **CSS ID**) add meg ugyanazt az azonosítót.

A Query ID legyen egyedi, és ne tartalmazzon szóközt, speciális karaktert vagy számot. Ha több szűrt widget van egy oldalon, mindegyiknek külön azonosító kell.

## Elementor Pro szolgáltatók

| Szolgáltató | Szűrt widget | Különlegesség |
|---|---|---|
| Elementor Pro Archive Products | Archive Products | A widgetnek a bolt archív oldalán kell lennie. CSS ID: a Query ID. |
| Elementor Pro Archive | Archive Posts | Archív sablonban használható; az oldalankénti bejegyzésszámot a **Beállítások → Olvasás** oldal szabályozza. CSS ID: a Query ID. |
| Elementor Pro Loop Grid | Loop Grid | Előbb sablon kell a ciklushoz. Kapcsold be az **Is Filterable** kapcsolót, és a CSS ID legyen a Query ID. |
| Elementor Pro Portfolio | Portfolio | A widget **Query** fülén a **Query ID** értéke `jet-smart-filters`. Ha több Portfolio van az oldalon, és csak egyet szűrsz, a szűrő Query ID-ja és a widget **Advanced** fülének CSS ID-ja egyezzen. |
| Elementor Pro Posts | Posts | A widget **Query** fülén a **Query ID** értéke `jet-smart-filters`. Több Posts widgetnél ugyanaz a szabály, mint a Portfolionál. |
| Elementor Pro Products | Products | CSS ID: a Query ID. |

## JetEngine szolgáltatók

A JetEngine-szolgáltatók is a Query ID-n át kapcsolódnak. Ha a Listing Grid egyéni lekérdezést (Query Builder) használ, ugyanazt az azonosítót be kell írni a lekérdezés **Egyéni lekérdezés-ID** mezőjébe is. Ha több lekérdezés van egy oldalon, mindegyiknek más azonosító kell.

| Szolgáltató | Szűrt widget | Különlegesség |
|---|---|---|
| JetEngine | Listing Grid | Válaszd ki a listázási sablont, és az **Advanced** fülön a CSS ID legyen a Query ID. |
| JetEngine Calendar | Dynamic Calendar | CSS ID: a Query ID. |
| JetEngine Maps | Maps Listing | CSS ID: a Query ID. |
| JetEngine Dynamic Table | Dynamic Table | Szükséges a Dynamic Tables Builder modul: **JetEngine → JetEngine → Modules → External Modules**. |
| JetEngine Dynamic Chart | Dynamic Chart | Szükséges a Dynamic Chart Builder modul ugyanott. |
| JetEngine Multi-Day Calendar | Multi-Day Calendar | CSS ID: a Query ID. |

## JetWooBuilder szolgáltatók

| Szolgáltató | Szűrt widget | Különlegesség |
|---|---|---|
| JetWooBuilder Products Grid | Products Grid | CSS ID: a Query ID. |
| JetWooBuilder Products List | Products List | CSS ID: a Query ID. |
| WooCommerce Archive (by JetWooBuilder) | Products Loop | Nem kell más beállítás: a widget a bolt archív oldalán működik. |

## WooCommerce szolgáltatók

- **Default WooCommerce Archive (Classic)**: a WooCommerce saját archívumát szűri. Nem kell hozzá Query ID, de a szűrőt a téma oldalsávjában kell elhelyezni.
- **WooCommerce Shortcode**: a rövidkóddal kiírt termékeket szűri. A Query ID-t a rövidkód `class` attribútumában kell megadni:

```text
[products limit="4" columns="4" orderby="id" order="DESC" visibility="visible" class="my_products"]
```

A szűrő Query ID-ja ebben a példában `my_products`.

## JSF Listing

A **JSF Listing** szolgáltató a JetSmartFilters saját listaépítőjével készített listákat szűri. A JSF Listing widgetnek nincs külön beállítása a szűrhetőséghez, csak a szűrőben kell kiválasztani a szolgáltatót.