Filtry produktów WooCommerce - nawigacja która sprzedaje
26% porzuceń sklepu to "nie mogę znaleźć produktu". Dobre filtry = szybsze znalezienie = wyższa konwersja. Pokażę Ci jak wdrożyć zaawansowane filtrowanie produktów w WooCommerce.
Krótka odpowiedź
Dlaczego filtry są kluczowe
Problem bez filtrów:
- 100+ produktów na stronie
- Scrollowanie bez końca
- Frustracja użytkownika
- Bounce rate +40%
Z dobrymi filtrami:
- Znajdź w 3 kliknięciach
- Porównaj podobne produkty
- Satysfakcja użytkownika
- Konwersja +10-20%
Kluczowe branże:
- Moda: rozmiar, kolor, płeć, cena
- Elektronika: marka, parametry, cena
- Meble: styl, kolor, materiał, wymiary
- Kosmetyki: typ skóry, składniki, marka
Zasada 3 klików:
- Użytkownik powinien dotrzeć do produktu w 3 klikach
- Filtry skracają ścieżkę
- Mniej klików = mniej drop-off
Wtyczki do filtrów
YITH Ajax Product Filter:
- Najpopularniejsza
- Ajax (bez reload)
- Darmowa: podstawowe filtry
- Premium: zaawansowane, SEO, presets
- Cena premium: €79.99/rok
FacetWP:
- Zaawansowana, developer-friendly
- Dowolne custom fields
- Elastyczna, ale trudniejsza
- Cena: $99/rok
JetSmartFilters (Crocoblock):
- Dla Elementor users
- Visual builder
- Cena: w pakiecie Crocoblock
WooCommerce Product Filters (free):
- Podstawowa, darmowa
- Prostsza funkcjonalność
Wybór:
- Start/prosty sklep: YITH Free
- Zaawansowany: YITH Premium lub FacetWP
- Elementor: JetSmartFilters
Typy filtrów
Kategorie:
- Hierarchiczne (drzewko)
- Checkboxy lub linki
- Liczba produktów w kategorii
Cena:
- Slider (range)
- Input min/max
- Predefined ranges (0-100, 100-500, 500+)
Atrybuty WooCommerce:
- Kolor (swatches - kolorowe kwadraty)
- Rozmiar (buttony: S, M, L, XL)
- Materiał (checkboxy)
- Marka (dropdown lub checkboxy)
Oceny:
- Stars filter (4+ gwiazdki)
- Sortowanie by rating
Dostępność:
- Na stanie / Brak
- Filter or show indicator
Custom fields:
- ACF lub custom meta
- FacetWP najlepszy do tego
Tagi:
- Dodatkowa taksonomia
- Dla cross-cutting attributes
UX filtrów
Placement:
Sidebar (desktop):
- Tradycyjne, sprawdzone
- Widoczne podczas browsing
- Sticky on scroll
Horizontal (above products):
- Nowoczesne
- Mniej miejsca
- Dropdown/expand on click
Mobile:
- Drawer (slide from left/right)
- Modal (full screen filters)
- Sticky "Filtry" button
- Applied filters as chips
Ajax filtering:
- Bez przeładowania strony
- Natychmiastowy feedback
- Loading indicator
- Must-have dla UX
Active filters:
- Pokazuj wybrane filtry
- Easy remove (X)
- "Wyczyść wszystkie"
Count:
- Pokaż ile produktów po filtrze
- "Rozmiar M (45)" vs "Rozmiar XS (0)"
- Ukryj puste opcje (opcjonalnie)
SEO dla filtrów
Problem:
- Filtrowane URLs generują duplikaty
- ?filter_color=blue&filter_size=m
- Google może indeksować wszystkie kombinacje
- Thin content, crawl budget
Rozwiązania:
Canonical URL:
- Wszystkie filtered pages → canonical do kategorii
- Zapobiega duplikatom
Noindex filtered:
- Meta robots noindex na filtered pages
- Lub via robots.txt
SEO-friendly URLs:
- /kategoria/kolor-niebieski/ zamiast ?filter=blue
- Niektóre wtyczki to oferują
- Ale: więcej combinacji!
Strategia:
- Główne filtry (kategoria, marka): SEO-friendly URLs
- Dodatkowe filtry: noindex
- Najpopularniejsze kombinacje: osobne landing pages
YITH SEO:
- Premium ma opcje SEO
- Canonical, noindex, URL structure