Wyszukiwarka na stronie sklepu internetowego – wygląd i funkcjonalność

Wyszukiwarka na sklepie internetowym jest jednym z podstawowych narzędzi każdego klienta. Wraz z drzewem kategorii, systemem filtracji, wariantami i pozostałymi produktami (moduł produktów polecanych) stanowi wchodzi w skład zespołu alejek sklepowych. Liczy się nie tylko jej wygląd, ale i umiejscowienie, funkcjonalność oraz wygląd strony z wynikami wyszukiwania. Wyszukiwarka produktów jest też jednym z pierwszych modułów, które poddaje się o-kodowaniu w celu jej lepszej wizualizacji i bardziej przystępnemu wyglądowi. W zależności od oprogramowania sklepowego, praca nad wyglądem, umiejscowieniem i funkcjonalnością wyszukiwarek produktowych zachodzi w nieco inny sposób, ale sposób ten nie różni się pod względem technologii programowania.

Ze względu na to, że moim ulubionym silnikiem z modeli open source jest wooCommerce, przedstawię tę problematykę z jego perspektywy. Przede wszystkim zaczynamy od odnalezienia i właściwego umiejscowienia wyszukiwarki produktowej na sklepie internetowym. WooCommerce to plugin WordPress w związku z czym oprogramowanie to oferuje dwie wyszukiwarki. Pierwsza z nich, wyszukiwarka WordPress służy do przeszukiwania wszystkich elementów strony, łącznie z wpisami, projektami, stronami i produktami (tzw. formularz wyszukiwania dla serwisu). Operując na kodzie wyszukiwarkę tę można skalibrować np. w ten sposób, aby przeszukiwała tylko karty produktowe, ale do tego zadania służy wyszukiwarka wooCommerce (tzw. formularz wyszukiwania dla sklepu). Obydwie wyszukiwarki można znaleźć w panelu administracyjnym w zakładce z widżetami i umieścić w panelu bocznym lub jednym z sześciu pól stopek.

Kiedy odnajdziemy wyszukiwarkę i podepniemy ją do któregoś z pól lub panelu bocznego, następnym naszym zadaniem jest odpowiednie umiejscowienie tego pola na stronie sklepu. Pole lub panel boczny z wyszukiwarką sklepową możemy umieścić w dowolnym miejscu strony, tylko na stronie głównej, tylko na stronach produktowych… etc., lub na wszystkich stronach sklepu. Dokładna lokalizacja wyszukiwarki też jest dowolna. Najczęściej umiejscawiamy wyszukiwarki produktowe z prawej strony na górze (nad menu głównym poziomym), u góry panelu bocznego lub w stopce strony.

Wygląd wyszukiwarki dostosowujemy do kolorystyki i ikon stosowanych na sklepie. Stosujemy kolory funkcyjne i żywe (wspomagające wydzielanie hormonów aktywności, jak dopamina, którą wyzwalają kolory od ciemnożółtego, po pomarańczowy i czerwony) lub kojące i uspokajające, jak zieleń (kolor nadziei) czy błękit (kolor namysłu). Pracę nad odpowiednim wyglądem wyszukiwarki sklepowej wykonujemy w oparciu o język programowania wyglądu struktury (kaskadowe arkusze stylów, CSS). Możemy zmienić w wyglądzie wyszukiwarki niemalże wszystko, jak np. rozmiar czcionki, jej rodzaj, marginesy, tło, wyświetlany tekst, etc..

Kodujemy wygląd wyszukiwarki mając na uwadze nie tylko wygląd sklepu, ale i sposób jej wyświetlania się oraz funkcje. Wyszukiwarka produktów na sklepie internetowym może być bowiem widoczna w całości, wraz z paskiem do wpisywania poszukiwanych fraz, lub częściowo ukryta z widoczną tylko ikoną, np. ikoną lupy. Istnieje kilka sposobów pojawiania się paska formularza wyszukiwania. Po naciśnięciu przycisku “szukaj” wyszukiwarka może się rozwinąć lub pojawić na nowej karcie, która przykryje stronę sklepu półprzezroczystym tłem (na przykład). Sama ikonka lupy może być umiejscowiona na stałe w dowolnym miejscu na stronie lub lewitować i podążać za użytkownikiem.

Pasek wyszukiwarki możemy też poddać modyfikacji dodając do niego inne elementy formularza, jak wybór kategorii czy inne elementy wyszukiwania zaawansowanego, jak przeszukiwanie opisów, przeszukiwanie z uwzględnieniem filtracji cech, etc.. Odpowiednia kalibracja wyszukiwarki może być domeną użytkownika oraz administratora. Możemy bowiem odpowiednio zawęzić lub poszerzyć zakres pracy wyszukiwarki, uwrażliwić ją na pewne elementy kart produktowych lub wyczulić na sposób, w jaki użytkownik wpisuje poszukiwane frazy.

Wyszukiwarka jest jedną z pierwszych elementów sklepu internetowego, którą zajmujemy się projektując jego wygląd i budując jego funkcjonalność. Podstawowe wersje oprogramowań sklepowych oferują wyszukiwarki o prostych funkcjach i mało atrakcyjnym wyglądzie. Naszym zadaniem jest je dostosować do potrzeb użytkownika.