Wyszukiwanie predykcyjne

Sieve zawiera predykcyjne wyszukiwanie produktów: pole wyszukiwania, które pokazuje pasujące produkty na liście rozwijanej w trakcie pisania. To osobny widget względem filtra, więc możesz umieścić go gdziekolwiek - w nagłówku, na stronie docelowej albo nad archiwum.

Umieszczanie

Użyj shortcode:

[sieve_search]

Albo dodaj blok Sieve Search w edytorze. Oba renderują to samo dostępne pole wyszukiwania.

Atrybuty shortcode

Atrybut	Domyślnie	Opis
placeholder	Search products	Tekst zastępczy w pustym polu.
button	yes	Pokaż przycisk wysyłania obok pola.
button_text	Search	Etykieta przycisku wysyłania.
limit	6	Maksymalna liczba podpowiedzi na liście (1-20).
min_chars	2	Liczba znaków wymagana, zanim pojawią się podpowiedzi (1-10).
in_stock_only	yes	Ogranicz podpowiedzi do produktów dostępnych w magazynie.

Przykład:

[sieve_search placeholder="Znajdź produkty..." limit="8" in_stock_only="no"]

Jak to działa

W trakcie pisania Sieve pobiera dopasowania z publicznego endpointu REST i renderuje listę produktów z miniaturą, nazwą, SKU i ceną. Każdy wynik prowadzi prosto do produktu, a link “zobacz wszystkie wyniki” otwiera pełną stronę wyszukiwania.

Podpowiedzi opierają się na wbudowanym wyszukiwaniu produktów WooCommerce, więc respektują widoczność katalogową i pozostają poprawne wraz z rozrostem katalogu. Skrypt wyszukiwania to mały, samodzielny pakiet: strony używające tylko [sieve_search] nigdy nie ładują silnika filtra, co utrzymuje ich szybkość.

Co dopasowuje

Lista podpowiedzi sięga poza nazwy produktów:

• Nazwy i SKU, dopasowywane do gotowego indeksu tokenów ze złożonymi (pozbawionymi znaków diakrytycznych) formami.
• Kategorie. Kategorie produktów, których nazwa pasuje do frazy, pojawiają się jako osobna grupa na liście i prowadzą wprost do przefiltrowanego archiwum kategorii. Pozwala to przejść do całej kategorii zamiast do pojedynczego produktu.
• Opisy i treść przez własne wyszukiwanie trafności WooCommerce, używane jako rezerwa, gdy indeks tokenów nic nie znajdzie.

Gdy pasują zarówno produkty, jak i kategorie, lista pokazuje dwie opisane grupy (Kategorie i Produkty). Nawigacja klawiaturą przechodzi po obu.

Niezależne od znaków diakrytycznych i odporne na literówki

Dopasowanie ignoruje znaki diakrytyczne: wpisanie lozko znajduje łóżko, a zolty znajduje żółty. Działa w obie strony, więc nie ma znaczenia, czy znaki ze znakami diakrytycznymi wpisze klient, czy występują one w nazwie produktu.

Tolerowane są też drobne literówki. Zapytanie zoltyy nadal znajdzie żółty, bo Sieve porównuje wpisane słowo z podobnymi słowami z nazw produktów i akceptuje bliskie dopasowanie. Kategorie są dopasowywane w ten sam sposób, niezależnie od znaków diakrytycznych.

Zarówno tekst produktu, jak i zapytanie są normalizowane w ten sam sposób do szybkiego indeksu tokenów, więc działa to sprawnie nawet przy dużych katalogach. Instalacja lub aktualizacja do tej wersji jednorazowo przebudowuje indeks wyszukiwania w tle.

Wyszukiwanie jako filtr

Samodzielne pole [sieve_search] powyżej przechodzi do produktu lub strony wyników. Wewnątrz filtra fasetowego wyszukiwanie działa inaczej: jest filtrem. Dodaj fasetę Wyszukiwanie do filtra [sieve], a klient może wpisywać tekst, aby zawężać siatkę produktów na żywo w miejscu, w połączeniu z każdą inną fasetą.

• Siatka zawęża się w trakcie pisania. Jak każda inna faseta, wyniki aktualizują się na żywo bez przeładowania strony, a wpisana fraza trafia do adresu URL (więc da się ją udostępnić i przetrwa przyciski wstecz/dalej).
• Ten sam indeks, niezależny od znaków diakrytycznych i odporny na literówki. Wyszukiwanie w siatce używa dokładnie tego samego złożonego indeksu tokenów co lista podpowiedzi, więc siatka i podpowiedzi zawsze są zgodne: lozko zawęża siatkę do łóżko, a drobna literówka nadal pasuje.
• Pomaga lista podpowiedzi. Pod polem pojawia się drobna lista podpowiedzi do wyboru klawiaturą; wybranie podpowiedzi ustawia precyzyjną frazę i ponownie filtruje siatkę w miejscu (nie przechodzi na inną stronę).
• To filtr, który można usunąć. Aktywne wyszukiwanie pojawia się jako etykieta (chip) na pasku obok innych filtrów; usunięcie etykiety (lub wyczyszczenie pola) przywraca pełną siatkę.
• Liczniki pozostają zgodne z prawdą. Liczniki pozostałych faset aktualizują się do wyszukanego zbioru, więc nigdy nie zobaczysz opcji prowadzącej do zera wyników.
• Podpowiedzi w zakresie. Gdy aktywne są inne fasety, podpowiedzi są ograniczone do tego wyboru, więc wyszukiwanie „w obrębie” bieżących filtrów proponuje tylko produkty faktycznie osiągalne.

Wyszukiwanie w siatce dopasowuje nazwy i SKU przez indeks. Produkty, które pasowałyby wyłącznie po tekście opisu, są osiągalne przez samodzielny widżet [sieve_search], a nie przez filtr w siatce.

Dostępność

Pole wyszukiwania stosuje wzorzec ARIA combobox:

• Pole to combobox sterujący listą listbox z opcjami.
• Podpowiedzi kategorii i produktów są udostępnione jako opisane grupy w obrębie listy.
• Strzałka w dół / w górę przechodzi po wszystkich podpowiedziach (kategoriach i produktach), Enter otwiera aktywną opcję, Escape zamyka listę.
• Aktywna opcja jest śledzona przez aria-activedescendant dla czytników ekranu.
• Gdy JavaScript jest niedostępny, pole wysyła zapytanie do standardowego wyszukiwania produktów WooCommerce, więc zawsze działa.

Wydajność

• Zapytania są opóźniane podczas pisania, a trwające zapytanie jest anulowane, gdy pojawi się nowy znak.
• Miniatury ładują się leniwie.
• Brak przesunięć układu: lista jest pozycjonowana absolutnie i nie rezerwuje miejsca, dopóki się nie otworzy.