FacetWP – Submit button

FacetWP Submit Button: Jak dodać przycisk do przesyłania

Wielu użytkowników poszukuje sposobów na zastosowanie filtrów na jednej stronie (takiej jak strona główna), które przekierowują do innej strony wyników. Dzięki wtyczce “Submit Button” to zadanie jest niezwykle łatwe do osiągnięcia. Wtyczka ta generuje przycisk przesyłania, który umożliwia przekazywanie wybranych danych z facetu z głównej strony do drugiej strony wyników.

Jak skonfigurować przycisk FacetWP Submit

Krok 1: Instalacja wtyczki Submit Button
Pierwszym krokiem jest pobranie, zainstalowanie i aktywowanie wtyczki “Submit Button”. To prosta procedura, która otworzy przed użytkownikami nowe możliwości na ich stronach.

Krok 2: Utworzenie szablonu listy
Aby filtry mogły pojawić się na głównej stronie, konieczne jest stworzenie szablonu listy. Dzięki temu FacetWP będzie wiedział, jakie wybory facetu wyświetlić. W większości przypadków nie chcemy, aby ten szablon był widoczny na głównych stronach, dlatego będziemy go ukrywać za pomocą CSS w kroku 5.

Najłatwiejszy sposób na stworzenie szablonu listy polega na użyciu narzędzia List Builder dostępnego w FacetWP. Można to zrobić, przechodząc do Ustawienia > FacetWP > Listy i dodając nowy szablon listy. W zakładce “Zapytanie” należy określić, z jakich typów postów FacetWP ma czerpać treści. Ważne jest, aby zapytanie było tak bliskie, jak to możliwe, zapytaniu strony wyników, na którą będziemy redyrekcjonować.

Krok 3: Utworzenie facetów
Następnie stwórz facetów, które chcesz umieścić na główniej stronie filtrów oraz na stronie wyników. Umożliwi to użytkownikom wybór preferencji i dostosowanie rezultatów do ich potrzeb.

Krok 4: Skonfigurowanie strony wyników
Kolejnym krokiem jest skonfigurowanie strony wyników. Jeśli masz już utworzoną stronę z wynikami, wystarczy dodać do niej stworzony w kroku 3 facet. Jeżeli nie, możesz stworzyć nową stronę. Najłatwiejszym sposobem jest użycie narzędzia List Builder i umieszczenie shortcodu listy na prostej stronie WordPress z facetami stworzonymi w kroku 3. Upewnij się, że pytanie używane jest identyczne z zapytaniem na stronie głównej.

Krok 5: Ustawienia strony filtrów
Przenieśmy się teraz do strony, na której chcesz, aby pojawiły się facety i przycisk przesyłania. Edytuj odpowiedni plik szablonu i dodaj kod do wyświetlenia szablonu listy, facetów i przycisku przesyłania.

Możesz używać kodu PHP w pliku functions.php swojego motywu, lub skorzystać z wtyczki do dodawania kodu. Przykład kodu PHP do wstawienia:

“`php

“`

Pamiętaj, aby URI strony wyników (np. /listings/) był ustawiony jako atrybut data-href przycisku. To pozwoli na przekierowanie do strony wyników po kliknięciu przycisku.

Wykorzystanie shortcodów i Elementor

Możesz również w łatwy sposób umieścić facet w treści postu lub na stronie, korzystając z shortcodów, które można dodać bezpośrednio w edycji treści WordPressa. Jeśli używasz Elementora, dzięki zainstalowanej wtyczce FacetWP możesz dodać widżet przycisku, a całość będzie wyglądała wyjątkowo profesjonalnie.

Jeśli wszystko jest ustawione poprawnie, po użyciu facetów i kliknięciu przycisku przesyłania strona przekieruje do strony wyników, a wybrane opcje będą wstępnie zaznaczone.

Automatyczne przesyłanie

Przesyłanie przy naciśnięciu Enter
Chociaż przycisk przesyłania działa dobrze, warto dodać opcję przesyłania wyników w momencie naciśnięcia klawisza Enter. Można to zrobić, dodając odpowiedni kod PHP do pliku functions.php. Kod ten uruchomi przesyłanie tylko wtedy, gdy użytkownik dokonał wyboru w facetach.

Natychmiastowe przesyłanie przy wyborze
Jeśli na stronie filtrów jest tylko jeden facet, możliwe jest również ustawienie natychmiastowego przesyłania po dokonaniu wyboru. Umożliwi to swoim użytkownikom błyskawiczne przefiltrowanie wyników, co znacznie poprawi doświadczenia związane z relacją człowiek-maszyna.

Ponadto, można ukryć przycisk przesyłania całkowicie, aby uprościć interfejs dla użytkowników. Warto jednak pamiętać, aby przycisk pozostał w kodzie źródłowym, aby mógł działać poprawnie.

Zmiana wizualna przycisku
Jeśli chcesz, aby przycisk przesyłania miał inną estetykę podczas korzystania z facetów, możesz dodać odpowiedni kod CSS, który zmienia jego wygląd w trakcie interakcji. Przykładem może być zmiana przezroczystości przycisku lub zmiana koloru czcionki.

Przeprowadzka do strony wyników po użyciu przycisku

Jeśli chcesz poprawić doświadczenia użytkownika na stronie wyników po użyciu przycisku przesyłania, można dodać kod, który przewinie stronę do góry wyników. Ta funkcjonalność wprowadza dodatkowy poziom zaawansowania w interakcji użytkownika z Twoją stroną.

Problemy z tematami Listify i Listable

Użytkownicy tematów Listify i Listable mogą natknąć się na pewne specyficzne problemy związane z integracją facetu i przycisku przesyłania. Warto sprawdzić, jakie problemy występują i jakie są potencjalne rozwiązania, aby uczynić doświadczenie użytkowania jeszcze lepszym.

Dodanie przycisku FacetWP Submit na Twojej stronie nie tylko poprawi wrażenia użytkowników, ale także zapewni, że Twoja strona będzie bardziej interaktywna i zgodna z oczekiwaniami współczesnych użytkowników. Pamiętaj, że odpowiednie ustawienia i konfiguracja są kluczowe dla sukcesu tej funkcjonalności.