Szűrők a klasszikus téma oldalsávjában

A szűrőket a bolt oldalainak oldalsávjába is betehetted. A példában az Astra téma oldalsávját használjuk, de bármelyik oldalsávot támogató klasszikus téma jó.

A bővítmény jelenleg csak klasszikus témákkal működik (például Astra, OceanWP, GeneratePress, Blocksy, Kava). A blokktémák egyelőre nem támogatottak.

Követelmények

• Aktív WooCommerce és JetSmartFilters.
• Klasszikus téma, amely támogatja az oldalsávot.

A szűrő létrehozása

1. Nyisd meg az Intelligens szűrők → Új hozzáadása oldalt.
2. Válaszd ki a kívánt szűrőtípust. A példában Kiválasztás.
3. Állítsd be a szűrőt. A példában az adatforrás Taxonómiák, az Osztályozás (taxonomy) pedig a Product feature (termékjellemző).
4. Kattints a mentés gombra.

Az oldalsáv testreszabása

1. Nyisd meg a Megjelenés → Widgetek oldalt.
2. Keresd meg és nyisd le a WooCommerce Sidebar területet. Ha a témád nem ad ilyen területet, használd az alapértelmezett oldalsávot.
3. Vegyél fel egy Címsor blokkot (a példában „Szűrés:” felirattal).
4. Vegyél fel egy szűrőblokkot, a példában a Kiválasztás szűrő blokkját. Az általános beállításokban válaszd ki az elkészített szűrőt, a This Filter For mezőben pedig az Default WooCommerce Archive (Classic) szolgáltatót.
5. A többi beállítást igény szerint módosíthatod. Kattints az Update gombra.

Lapozás-kompatibilitás beállítása

1. Nyisd meg az Intelligens szűrők → Beállítások oldalt, és kattints a Compatibility fülre.
2. A Pagination Container CSS Selector és a Pagination Item CSS Selector mezőt ellenőrizd. Astra témánál az alapértelmezett érték jó, más témánál át kell írni.

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

A képen a Compatibility fül látszik. A lapozás CSS-választói a WooCommerce részen belül vannak, ezt kell lenyitni.

A megfelelő értékek kiderítéséhez nyisd meg a bolt oldalát, és a böngésző fejlesztői eszközeivel nézd meg a lapozó osztályait:

1. Jelöld ki a lapozó tárolóját, és olvasd le az osztályát (a példában woocommerce-pagination). Másold a Pagination Container CSS Selector mezőbe.
2. Jelölj ki egy lapozóelemet, és olvasd le az osztályát (a példában a.page-numbers). A Pagination Item CSS Selector mezőbe a tároló osztályával együtt írd be:

.woocommerce-pagination a.page-numbers

A bolt oldal megjelenése

Ha még nem állítottad be, a Megjelenés → Testreszabás oldalon, a WooCommerce és az Egyedi termék lapokon módosíthatod az elrendezést és a többi beállítást. Kattints a Közzététel gombra.

Az eredmény

A bolt oldalon az oldalsávban látszik a szűrő. Egy opció (például „Akciós”) kiválasztása után a lista szűkül. A szűrő együtt működik a WooCommerce lapozásával, a találatszámlálóval és a rendezéssel.