# Szűrők az Elementor Pro Loop Gridhez

> Az Elementor Pro Loop Grid szolgáltató bekapcsolása, szűrő összekötése a Loop Griddel, az AJAX korlátai és a no-filter érték.

A JetSmartFilters szűrői összeköthetők az Elementor Pro **Loop Grid** widgetjével, egyéni kód nélkül. A kapcsolat a **Query ID** és a Loop Grid **CSS ID** mezője által jön létre.

Új projektnél a JetEngine **Listing Grid** és a Query Builder az ajánlott megoldás, mert teljes AJAX-támogatása van, és nincsenek szerkezeti korlátai ([Szűrők a Listing Gridhez](https://hub.hellowp.io/hu/plugins/jet-smart-filters/widgetek-listing-grid/)).

## Követelmények

- Aktív Elementor Pro.
- Aktív JetSmartFilters.

## A szolgáltató bekapcsolása

1. Nyisd meg az **Intelligens szűrők → Beállítások** oldalt.
2. Az **Általános beállítások** fülön kapcsold be az **Elementor Pro Loop Grid** kapcsolót.

Innentől az **Elementor Pro Loop Grid** szolgáltató választható a szűrőknél.

## A szűrő létrehozása

1. Nyisd meg az **Intelligens szűrők → Új hozzáadása** oldalt.
2. Hozd létre a kívánt szűrőt. A példában ez egy **Kiválasztás** szűrő, amely kategória szerint szűri a bejegyzéseket.
3. Kattints az **Update** gombra.

## A szűrő alkalmazása a Loop Gridre

1. Nyisd meg az oldalt, amelyen a Loop Grid van.
2. Add hozzá a Loop Grid és a szűrő widgetjét.
3. A szűrő widgetjében válaszd ki a létrehozott szűrőt, és a **This filter for** mezőben az **Elementor Pro Loop Grid** szolgáltatót.
4. A Loop Grid widgetjében kapcsold be az **Is Filterable** kapcsolót. Ennek bekapcsolása kötelező, különben a szűrő nem hat.

### Összekötés Query ID-val

A Query ID elhagyható, de ajánlott, ha:

- a szűrőt egy konkrét widgethez akarod kötni,
- több szűrhető widget van ugyanazon az oldalon,
- pontosan szabályozni akarod, melyik widget reagáljon a szűrőre.

1. Nyisd meg a szűrő widgetjét, és a **Query ID** mezőbe írj egy egyedi értéket. Csak betűket használj, szóköz, szám és speciális karakter nélkül, és ügyelj arra, hogy egyedi legyen.
2. A Loop Grid widgetjében nyisd meg a **Haladó** részt, és a **CSS ID** mezőbe írd be pontosan ugyanazt az értéket.
3. Kattints a **Publish** gombra.

## Az AJAX korlátai a Loop Gridnél

Az Elementor Pro Loop Grid szerkezeti korlátai miatt az **AJAX** alkalmazási módnál az URL-paraméterek nem jutnak át helyesen. Ezt az Elementor Pro megvalósítása okozza, nem a JetSmartFilters.

Állítsd a Loop Gridhez kötött minden szűrő **Apply type** értékét **Page reload** módra. Ez vonatkozik a **Rendezés** szűrőre is, amely AJAX mellett szintén nem tudja helyesen átadni a paramétereket. A **Keresés** szűrő egyéni keresése is érintett.

Ha teljes AJAX-szűrés kell, használd inkább a JetEngine Listing Gridet a Query Builderrel.

### A Loop Grid egyéb beállításai

Ha a Loop Griddel Lapozás widgetet használsz:

- a Loop Grid saját lapozását kapcsold ki,
- a Loop Grid **Nothing Found Message** üzenetét kapcsold ki, ha be van kapcsolva. Helyette használhatod a **No Result Text** mezőt, amely az **Is Filterable** bekapcsolása után jelenik meg,
- ha a lekérdezési forrásnál megjelenik a **Query ID** mező, a lekérdezés funkcióinál írd be a „jet-smart-filters” értéket. Győződj meg róla, hogy az itt kiválasztott forrás megegyezik a Loop Grid létrehozásakor kiválasztottal.

## Más rácsok védelme a szűrőtől

Ha az oldalon több szűrhető rács van, a szűrő olyanra is hathat, amelyre nem szántad. Ez főleg akkor fordul elő, ha:

- több Loop Grid van ugyanazon az oldalon,
- egy felugró ablak saját Loop Gridet tartalmaz, de az a főoldali rácsra hat.

Ha egy rácsnak nem szabad reagálnia a szűrőkre, írd a **CSS ID** mezőjébe a „no-filter” értéket. Például a felugró ablak rácsa a helyes beállítás nélkül az oldal rácsát szűrné; a „no-filter” érték ezt megakadályozza.

## Az eredmény

Nyisd meg a nyilvános oldalt, és alkalmazd a szűrőt. A Loop Grid csak a szűrési feltételnek megfelelő elemeket mutatja.

## Gyakori kérdések

| Kérdés | Válasz |
| --- | --- |
| Miért nem működik a szűrő a Loop Griddel? | Leggyakrabban a szűrő **Query ID** mezője és a Loop Grid **CSS ID** mezője nem egyezik. Nézd meg azt is, hogy az **Elementor Pro Loop Grid** szolgáltató van-e kiválasztva a szűrőben, és be van-e kapcsolva az **Is Filterable** a Loop Gridben. |
| Miért nem megy az AJAX a Loop Griddel? | Az Elementor Pro Loop Grid korlátai miatt egyes paraméterek (egyéni keresés, rendezés) AJAX mellett nem jutnak át. Használd a **Page reload** módot, vagy a Listing Gridet. |
| Miért hat a szűrő egy másik Loop Gridre is? | Több rács esetén a szűrő nem a kívánt rácshoz is kapcsolódhat. Adj egyedi azonosítót a célrácsnak, a többinek, amelyek ne reagáljanak, pedig „no-filter” **CSS ID**-t. |
| Használhatok több Loop Gridet? | Igen. Minden szűrőnek legyen saját **Query ID** értéke, és a hozzá tartozó Loop Grid ugyanazt használja. |
| A Loop Grid az ajánlott megoldás? | Támogatott és sok esetben jól működik. Új projektnél, ha teljes AJAX-támogatás és nagyobb rugalmasság kell, a Listing Grid a Query Builderrel az ajánlott. |