Jedną z rzeczy, które kocham w WordPressie, jest sposób korzystania z WP_Query Klasa do tworzenia własnych zapytań niestandardowych. To może odpytywać o wszystko, co chcesz do bazy danych-i mam na myśli wszystko. Posty, niestandardowe posty, Taksonomia, autorzy, niestandardowe pola, status logowania użytkownika: nadajesz mu nazwę, możesz ją uwzględnić w argumentach zapytania.

Ale wyobraź sobie, że chcesz dać odwiedzającym witrynę możliwość uruchomienia, powtórzenia lub aktualizacji zapytania dodanego w witrynie. Czy jest możliwe, aby zapewnić przycisk, który pozwala im to zrobić?

Odpowiedź brzmi: tak.

W tym poście pokażę Ci naprawdę prostą technikę dodawania przycisku do strony w Twojej witrynie, która uruchamia niestandardowe zapytanie. Użyję zapytania, które stworzyłem dla wcześniejszego postu, który zapytał niestandardowe pola i wyświetlił listę losowych “ulubionych rzeczy”.

Zapytanie w obecnej formie jest już interesujące, które wykorzystuje "rnd" argument do wyszukiwania i wyświetlania wartości pól niestandardowych w sposób losowy. Wykorzystuje również tablicę zmiennych do przechowywania danych z trzech postów, a następnie wyprowadza je wszystkie razem w jednym akapicie.

Pokażę Ci, jak dodać do tego zapytania, tworząc przycisk na stronie, który pozwala użytkownikom ponownie uruchomić zapytanie i wyświetlić więcej losowych ulubionych rzeczy.

Czego potrzebujesz

Aby śledzić wraz z tym postem, musisz następujące:

  • Testowa lub rozwojowa instalacja WordPressa i
  • Edytor kodu.

Ten post jest dość zaawansowany, więc jeśli w którymś momencie utkniesz, możesz zatrzymać się i spędzić trochę czasu na naszych kursach Akademii w tworzeniu WordPressa. Mój kurs średniozaawansowany daje Ci dobre uziemienie w całym kodzie, którego będę używał w tym poście.

Uwaga: kod dołączony do tego samouczka jest dostępny na GitHub.

Podsumowanie naszego dotychczasowego kodu

Podsumujmy dotychczasowy kod. W moim wcześniejszym poście pokazałem ci, jak napisać wtyczkę, która robi kilka rzeczy:

  • Rejestrowanie niestandardowego typu postu o nazwie “ulubione”
  • Tworzenie pola meta dla ekranu edycji postu dla naszego nowego typu postu
  • Dodawanie kilku pól do tego metaboxa
  • Dodając kilka ulubionych rzeczy i wypełniając nasze pola metabox dla każdego z nich
  • Uruchamianie niestandardowego zapytania w celu pobrania danych o naszych ulubionych rzeczach
  • Przechowywanie tego, co daje nam zapytanie w tablicy zmiennych
  • Wysyłanie go jako tekstu na stronie

Możesz znaleźć Pełny kod wtyczki na GitHub (i w moim wcześniejszym poście), ale w tym poście będziemy pracować nad ostatnią funkcją w naszej wtyczce, która wyświetla zapytanie:

Ładowanie gist 4828692c2c48e9222f33d4058fdaaabb

A oto co jest na stronie:

More Favourite things output in a paragraph

Dodamy więc przycisk pod akapitem “ulubione rzeczy”, który pozwala użytkownikom ponownie uruchomić zapytanie i zobaczyć więcej ulubionych rzeczy.

Będzie to składać się z dwóch etapów:

  • Edycja zapytania w naszym pluginie
  • Dodawanie stylów dla przycisku (w tym prawidłowe sprawdzanie arkusza stylów).

Zacznijmy od edycji tego zapytania.

Edycja zapytania

Dodanie przycisku polega na dodaniu linii do argumentów zapytania, a następnie dodaniu znaczników przycisku pod akapitem z listą ulubionych rzeczy.

Zacznijmy od argumentów zapytania.

Znajdź tę sekcję kodu wtyczki:

Ładowanie gist cab350b7e8ee4a5abac0c11d46453816

Poniżej, dodaj tę linię:

Ładowanie gist 21ba563366b477cde6123d91d6e396ea

Sprawdza, czy przycisk, który zamierzamy utworzyć, został kliknięty i jeśli tak, aktualizuje zapytanie. Teraz dodajmy przycisk.

Znajdź tę sekcję tej samej funkcji:

Ładowanie gist 3723e4075e6ad563cb266b044cd9dad2

Dodaj do niego nową linijkę, aby brzmiała tak:

Ładowanie gist c6e0335072bc42db2c18e8b3245e08b4

Dodaje To przycisk, który nie łączy się z inną stroną w witrynie, ale z funkcją aktualizacji argumentów zapytania. Tak więc po kliknięciu przycisku aktualizuje argumenty zapytania i uruchamia je ponownie.

Teraz zapisz swój plik i spójrz na swoją witrynę. Mój wygląda tak:

Favourite things list with link to refresh query but no styling

Mój link tam jest i jeśli na niego kliknę, odświeża zapytanie. Ale to nie wygląda jak guzik. Dodajmy więc trochę stylizacji.

Tworzenie i wyszukiwanie arkusza stylów

W folderze wtyczek Dodaj nowy folder o nazwie css. Wewnątrz, Dodaj nowy plik o nazwie styl.css. To będzie zawierać wszystkie style dla naszej wtyczki.

Aby arkusz stylów działał, musisz go poprawnie zapytać. W głównym pliku Wtyczki Dodaj tę funkcję:

Ładowanie gist 31155c221a1198afafa4980bbb8872ea

To poprawnie wyświetla arkusz stylów w Twojej wtyczce.

Teraz, aby dodać trochę stylizacji.

Dodawanie stylizacji do naszego przycisku

Otwórz właśnie utworzony arkusz stylów. Musisz wystylizować .przycisk klasy, jak również link, który zawiera. Moja stylizacja jest poniżej, ale możesz zmienić swoje kolory:

Ładowanie gist 5f2aaa901e4a62677a36270f60fecae9

Teraz Mój przycisk wygląda tak:

Favorite things list with link to refresh query with styling

Tak lepiej! Możesz poświęcić trochę czasu na modyfikowanie CSS, dodawanie efektów najechania kursorem lub zmianę koloru tekstu. Ale zalecam, aby było to proste.

Umożliwienie użytkownikom odświeżenia zapytania jest prostsze niż mogłoby się wydawać

Kod, który dodaliśmy do naszego zapytania, aby dodać ten przycisk, składał się z zaledwie dwóch linii. Jak widać, utworzenie przycisku, aby odwiedzający witrynę mogli odświeżyć zapytanie, jest bardzo proste. Dodaj te dwie linie kodu, stwórz stylizację i gotowe!

Czy użyłeś przycisku, aby umożliwić użytkownikom odświeżanie lub uruchamianie zapytania w Twojej witrynie? Daj nam znać swoje pomysły na to, jak można to zastosować w komentarzach!
You May Also Like

Jak naprawić nieprawidłowy błąd JSON w WordPress (Przewodnik dla początkujących)

W artykule: Co powoduje błąd “nieprawidłowa odpowiedź JSON” w WordPress?1. Sprawdź adresy…

Jak naprawić błąd krytyczny w WordPress (krok po kroku)

W artykule: Co To jest błąd krytyczny w WordPress?Co powoduje krytyczny błąd…

Jak zmienić kolor linku w WordPress (poradnik dla początkujących)

W artykule: Dlaczego Linki Są Ważne?Jak dodawać linki w postach i stronach…

9 Najlepsze Darmowe Wtyczki WordPress Author Bio Box

W artykule: 1. Simple Author Box2. Branda3. Autor postu WP4. Author Bio…