Szűrők a WooCommerce shortcode-hoz

A WooCommerce [products] shortcode-ja termékeket listáz bármelyik oldalon. A JetSmartFilters szűrői ezt a listát is szűrik, az oldal újratöltése nélkül. Itt a Gutenberg-szerkesztővel dolgozunk, de Elementorban ugyanígy működik.

Követelmények

• Elementor (az ingyenes is elég) vagy a blokkszerkesztő (Gutenberg).
• Aktív WooCommerce.
• Aktív JetSmartFilters.

A szolgáltató bekapcsolása

1. Nyisd meg az Intelligens szűrők → Beállítások oldalt (vagy a Crocoblock → JetPlugins Settings → JetSmartFilters oldalt).
2. Az Általános beállítások fülön kapcsold be a WooCommerce Shortcode kapcsolót.

https://minta-bolt.hu/wp-admin/admin.php?page=jet-dashboard-settings-page&subpage=jet-smart-filters-general-settings

A képen a szolgáltatók kapcsolói látszanak. A WooCommerce shortcode-hoz tartozó kapcsolónak bekapcsolva kell lennie.

A szűrők létrehozása

Minden szűrőt az Intelligens szűrők → Új hozzáadása oldalon veszel fel.

Szűrés termékár szerint

1. Válaszd a Jelölőnégyzetes tartományszűrő típust.
2. Az Opciók listája részben vedd fel a sávokat. A példában: „1-100”, „101-200” és „201-300”.
3. A többi beállítást igény szerint töltsd ki. A példában az Értékek utótagja mezőben pénznemjel áll.
4. A Lekérdezési változó mezőbe írd be: _price. Ez a WooCommerce ármezője.
5. Mentsd a szűrőt.

Ha csúszkás ártartományt szeretnél, a Tartomány típust használd (lásd az ártartomány-szűrő fejezetet).

Szűrés termékcímke szerint

1. Válaszd a Választógomb típust.
2. Az adatforrás legyen Taxonómiák, a taxonómia pedig Termékcímkék. A többi beállítás szabadon alakítható.
3. A Use Custom Query Variable kapcsolót hagyd kikapcsolva: taxonómia forrásnál a lekérdezési változót a bővítmény magától kezeli.
4. Mentsd a szűrőt.

Szűrés termékattribútum szerint

1. Válaszd a Jelölőnégyzetek listája típust.
2. A WooCommerce az attribútumokat taxonómiaként tárolja, ezért az adatforrás legyen Taxonómiák, a taxonómia pedig a kívánt attribútum (a példában a Termékszín).
3. A Use Custom Query Variable kapcsoló itt is maradjon kikapcsolva.
4. Mentsd a szűrőt.

Szűrés termékértékelés szerint

1. Válaszd az Értékelés típust.
2. A Csillagok száma mezővel a legnagyobb értékelést adod meg. Az Egyenlőtlenségi operátor listából válaszd ki a relációt (például nagyobb vagy egyenlő).
3. A Lekérdezési változó mező jobb oldalán kattints a dinamikus címke ikonjára, és válaszd a _wc_average_rating mezőt.
4. Mentsd a szűrőt.

Az értékelésszűrő részletei a termékek szűrése értékelés szerint fejezetben vannak.

A shortcode az oldalon

1. Hozz létre egy új oldalt, vagy nyiss meg egy meglévőt.
2. Vegyél fel egy Shortcode blokkot, és írd bele a WooCommerce shortcode-ot. Például a négy legújabb termék:

[products limit="4" columns="4" orderby="id" order="DESC" visibility="visible"]

A [products] shortcode paramétereinek teljes listáját a WooCommerce saját dokumentációja tartalmazza. Bármilyen termékválogatást összeállíthatsz vele.

A szűrőblokkok felvétele

1. A szűrőknek külön oszlopot vagy sort érdemes adni a lista mellett.
2. Add hozzá a megfelelő szűrőblokkot (például Jelölőnégyzetes tartományszűrő, Választógomb, Jelölőnégyzetek listája, Értékelés).
3. A blokk beállításaiban válaszd ki a létrehozott szűrőt, a This Filter For mezőben pedig a WooCommerce Shortcode szolgáltatót.
4. A Jelölőnégyzetek listája és a Választógomb blokk További beállítások fülén az elrendezést is alakíthatod. A példában a Keresés engedélyezve és a Legördülő engedélyezve funkciót is bekapcsoltuk.
5. Mentsd az oldalt.

https://minta-bolt.hu/termekszurok/

A képen a csúszkás ártartomány, a címke szerinti választógombok és az értékelésszűrő látszik a shortcode által kiírt termékek fölött. Ha bejelölsz egy opciót, a lista a megfelelő termékekre szűkül.