Filtry produktow WooCommerce – jak poprawic nawigacje i konwersje w sklepie

Filtrowanie produktow to nie luksus – to standard UX w e-commerce. Klienci przyzwyczajeni do Allegro i Amazona oczekuja mozliwosci zawezenia wynikow po: cenie, kolorze, rozmiarze, materiale, marce, ocenie.
Dane mowia same za siebie: sklepy z wdrozonymi filtrami Ajax (bez przeladowania strony) notuja sredni wzrost konwersji o 26% i 35% dluzszy czas na stronie. Mniej klientow odchodzi sfrustrowanych, wiecej trafia do koszyka. Wiecej o optymalizacji konwersji.

YITH WooCommerce Ajax Product Filter – darmowa wersja + premium ($79/rok). Filtrowanie po atrybutach, cenie, kategoriach, tagach. Ajax (bez przeladowania). Dobra integracja z motywami YITH. Najpopularniejsza opcja.
JetSmartFilters (Crocoblock) – premium ($49/rok w pakiecie Crocoblock). Zaawansowane filtry z Elementorem i Gutenbergiem. Hierarchiczne filtry, zakres dat, checkbox + radio + slider. Najlepsza opcja dla stron budowanych w Elementorze.
WooCommerce Product Filter by BeRocket – darmowa + premium ($39/rok). Ajax filtering, widget sidebar, color swatches. Solidna darmowa wersja. Wada: mniej aktualizacji niz konkurencja.
FacetWP – premium ($99/rok). Najszybsze dzialanie przy duzej liczbie produktow (1 000+). Faceted search, Ajax, kompatybilnosc z praktycznie kazdym motywem. Wada: brak darmowej wersji.
Potrzebujesz profesjonalnej konfiguracji filtrow? Skontaktuj sie z nami – dobierzemy i wdrozymy filtry dopasowane do Twojego asortymentu.

1. Zainstaluj wtyczke i aktywuj ja w panelu WordPress.
2. Utworz filtry po atrybutach – kolor, rozmiar, material. Upewnij sie, ze produkty maja wypelnione atrybuty w panelu WooCommerce (Produkty -> Atrybuty).
3. Dodaj filtr cenowy – dwie opcje: slider (przesuwny zakres) lub checkboxy z predefiniowanymi zakresami (0–50 zl, 50–100 zl, 100–200 zl). Slider jest bardziej elastyczny, checkboxy szybsze na mobile.
4. Umiejscowienie filtrow – sidebar (klasyczne podejscie, sprawdza sie na desktopie), nad produktami (widoczne od razu), popup/drawer na mobile (najlepsza opcja UX na telefonach).
Atrybuty produktow to fundament filtrow – jesli nie masz ich wypelnionych, filtry nie beda dzialac. Przeczytaj o wariantach i atrybutach WooCommerce.

To temat, ktory wiekszoscsc artykulow pomija, a jest krytyczny:
Problem duplikacji tresci. Filtrowanie tworzy setki kombinacji URL (np. /sklep/?color=red&size=xl). Kazdy taki URL to potencjalny duplikat w oczach Google. Rozwiazanie: canonical URLs wskazujace na glowna strone kategorii.
Noindex dla filtrowanych stron. Dodaj noindex do stron generowanych przez filtry – nie chcesz, zeby Google indeksowal /sklep/?color=red&size=xl&price=50-100. W wyjatkach: indeksuj popularne kombinacje z duzym wolumenem wyszukiwan (np. "czarne buty meskie rozmiar 44").
Crawl budget. Setki filtrowanych URL moga wyczerpac budzet crawlowania bota Google. Rozwiazanie: zablokuj parametry filtrow w robots.txt lub Google Search Console. Wiecej o crawl budget w artykule o optymalizacji crawlowania.
Ajax a boty Google. Filtry Ajax laduja tresci dynamicznie – Googlebot moze ich nie widziec. Upewnij sie, ze wtyczka generuje prawdziwe URL-e lub uzywa pushState dla przyjaznych adresow.

Mobile-first. 70%+ ruchu w e-commerce to mobile. Sidebar z filtrami nie dziala na telefonach – uzyj drawer (wysuwanego panelu) lub bottom sheet. Przycisk "Filtry" widoczny nad produktami, po kliknieciu – panel wysuwa sie z dolu ekranu.
Lazy loading wynikow. Zamiast ladowac 100 produktow naraz – pokazuj 20 i doladowuj przy scrollowaniu. Zmniejsza First Load Time i poprawia Core Web Vitals.
Wplyw na CLS i LCP. Filtrowanie Ajax moze powodowac Content Layout Shift (CLS) – produkty "przeskakuja" po zaladowaniu filtrow. Ustaw stala wysokosc kontenera produktow i placeholder skeleton. Sprawdz LCP po wdrozeniu filtrow – dodatkowy JavaScript moze spowalnic renderowanie.