Wykorzystaj moc haków WordPress: wyjaśnione działania i filtry

Jak każdy CMS, WordPress nie zawsze spełnia wszystkie Twoje potrzeby od razu po wyjęciu z pudełka. Ponieważ jest to oprogramowanie typu open source, możesz go zhakować, aby dostosować go do potrzeb biznesowych, ale zamiast tego możesz użyć haczyków WordPress, aby osiągnąć swoje cele. Budowanie za pomocą haków to zwycięska strategia, która pozwala programistom WordPress na zbudowanie niemal każdej funkcji witryny, jaką można sobie wyobrazić.

WordPress Hooki: działania i filtry

Hooki WordPress to nie tylko potężne narzędzia do dostosowywania, ale także sposób, w jaki komponenty WordPressa współdziałają ze sobą. Zahaczone funkcje zarządzają wieloma rutynowymi zadaniami, które uważamy za nieodłączną część WordPressa, takimi jak dodawanie stylów lub skryptów do strony lub otaczanie tekstu stopki elementami HTML. Przeszukanie bazy kodu WordPress Core ujawnia tysiące haczyków w ponad 700 lokalizacjach. Motywy i wtyczki WordPress zawierają jeszcze więcej haczyków.

Zanim przejdziemy do hooków i zbadamy różnicę między hookami akcji i hookami filtrów, przyjrzyjmy się, gdzie mieszczą się one w architekturze WordPressa.

Infrastruktura WordPress

Modułowe elementy WordPressa łatwo integrują się ze sobą, dzięki czemu możemy łatwo mieszać, dopasowywać i łączyć:

1. WordPress Core: są to pliki wymagane do działania WordPressa. WordPress Core zapewnia uogólnioną architekturę, pulpit nawigacyjny WP Admin, zapytania do bazy danych, zabezpieczenia i wiele innych. WordPress Core jest napisany w PHP i korzysta z bazy danych MySQL.
2. Motyw (lub motyw nadrzędny): Motyw definiuje podstawowy układ i projekt witryny internetowej. Oparty na plikach PHP, HTML, JavaScript i CSS motyw działa, odczytując bazę danych MySQL WordPress w celu wygenerowania kodu HTML, który renderuje się w przeglądarce. Hooki w motywie mogą na przykład dodawać arkusze stylów, skrypty, czcionki lub niestandardowe typy postów.
3. Motyw potomny: sami tworzymy motywy potomne, aby dostroić podstawowy układ i projekt zapewniany przez motywy nadrzędne. Motywy potomne mogą definiować arkusze stylów i skrypty, aby modyfikować odziedziczone funkcje lub dodawać lub usuwać typy postów. Instrukcje motywu potomnego zawsze zastępują instrukcje motywu nadrzędnego.
4. Wtyczki : Aby rozszerzyć funkcjonalność zaplecza WordPress, możemy wybierać spośród tysięcy wtyczek innych firm. Hooki we wtyczce mogą na przykład powiadamiać nas e-mailem o opublikowaniu posta lub ukrywać przesłane przez użytkowników komentarze zawierające zabroniony język.
5. Wtyczki niestandardowe: Gdy wtyczka innej firmy nie spełnia w pełni potrzeb biznesowych, możemy ją turbodoładować, pisząc niestandardową wtyczkę w PHP. Albo możemy napisać nową wtyczkę od podstaw. W obu przypadkach dodamy zaczepy, aby rozszerzyć istniejącą funkcjonalność.

Biorąc pod uwagę, że mamy dostęp do źródła wszystkich pięciu warstw, dlaczego w WordPressie potrzebne są haki?

Bezpieczeństwo kodu

Aby nadążyć za ewoluującymi technologiami, współtwórcy WordPress Core, motywów nadrzędnych i wtyczek często publikują aktualizacje, które łagodzą luki w zabezpieczeniach, naprawiają błędy, usuwają niezgodności lub oferują nowe funkcje. Jak każdy konsultant z doświadczeniem w sytuacjach awaryjnych wie z pierwszej ręki, brak aktualizacji komponentów WordPressa może zagrozić lub nawet wyłączyć witrynę.

Jeśli bezpośrednio modyfikujemy lokalne kopie nadrzędnych komponentów WordPress, napotykamy problem: Aktualizacje zastępują nasze dostosowania. Jak możemy to obejść podczas dostosowywania WordPressa? Za pomocą zaczepów, w motywie potomnym i niestandardowych wtyczkach.

Kodowanie w naszym motywie dziecięcym

Motyw potomny to bezpieczna przestrzeń, w której możemy dostosować wygląd i działanie naszego zainstalowanego motywu. Każdy dodany tutaj kod zastąpi porównywalny kod w elemencie nadrzędnym bez ryzyka zastąpienia przez aktualizację.

Gdy motyw potomny jest aktywowany, łączy się z dezaktywowanym rodzicem, dziedzicząc i prezentując cechy rodzica, pozostając nienaruszonym przez aktualizacje rodzica. Aby nie paść ofiarą pokusy zmodyfikowania motywu, najlepsze praktyki sugerują, aby w ramach naszej konfiguracji aktywować motyw potomny.

Pisanie niestandardowych wtyczek

Gdy wtyczka jest aktywowana, jej plik functions.php jest wykonywany przy każdym wywołaniu na serwerze. Z kolei WordPress ładuje i sortuje hooki ze wszystkich aktywnych wtyczek zgodnie z ich priorytetem i wykonuje je sekwencyjnie. Aby rozszerzyć funkcjonalność wtyczki innej firmy, możemy napisać własną niestandardową wtyczkę WordPress.

Gdzie umieścić nasze haki w WordPressie

Przygotowanie do nurkowania: Definicje

Aby uniknąć mylenia terminów, będziemy trzymać się tej terminologii:

• Hak to idealne miejsce w WordPressie, w którym rejestrowane są funkcje do uruchamiania. Możemy podłączyć nasze funkcje do jednego z wielu hooków w WordPressie i jego komponentach lub stworzyć własne.
  • Hak akcji uruchamia akcje.
  • Hak filtra uruchamia filtry.
• Zahaczona funkcja to niestandardowa funkcja zwrotna PHP, którą „zahaczyliśmy” do lokalizacji zaczepienia WordPressa. Typ, którego należy użyć, zależy od tego, czy podpięcie ma umożliwiać zmiany poza funkcją — np. dodawanie bezpośrednio do danych wyjściowych strony internetowej, modyfikowanie bazy danych lub wysyłanie wiadomości e-mail. Są to tak zwane efekty uboczne .
  • Filtr (lub funkcja filtrująca ) powinien unikać efektów ubocznych, pracując tylko na, a następnie zwracając zmodyfikowaną kopię przekazanych do niej danych.
  • Natomiast działanie (lub funkcja działania ) ma na celu wywołanie skutków ubocznych. Nie ma wartości zwracanej.

Mając na uwadze te różnice, możemy rozpocząć naszą eksplorację haków.

Abstrakcja i czysty kod

Kiedy akcja lub filtr są włączone do hooka, zgodnie z potrzebami, realizujemy cele polegające na napisaniu tylko jednej funkcji na zadanie i unikaniu powielania kodu w ramach projektu. Załóżmy na przykład, że chcemy dodać ten sam arkusz stylów do trzech szablonów stron (archiwum, pojedyncza strona i niestandardowy post) w naszym motywie. Zamiast zastępować każdy szablon w nadrzędnym, a następnie odtwarzać każdy w naszym motywie potomnym, a następnie dodawać arkusze stylów do poszczególnych sekcji nagłówka, możemy napisać kod w jednej funkcji i dołączyć go za pomocą haka wp_head .

Przemyślana nomenklatura

Aktywnie unikaj konfliktów, nadając unikatowe nazwy motywowi podrzędnemu lub niestandardowym podpięciom wtyczek. Posiadanie haków o tej samej nazwie w jednej witrynie to przepis na niezamierzone zachowanie kodu. Zgodnie z najlepszymi praktykami nazwę naszego przechwycenia zaczynamy od unikalnego, krótkiego przedrostka (np. inicjałów autora, projektu lub firmy), po którym następuje opisowa nazwa przechwycenia. Na przykład, używając wzorca „inicjały projektu plus nazwa haka”, dla projektu Fabulous Plugin Tahira, moglibyśmy nazwać nasze haki tfp-upload-document lub tfp-create-post-news .

Równoczesny rozwój i debugowanie

Pojedynczy hak może wywołać więcej niż jedną akcję lub filtr. Na przykład, moglibyśmy napisać stronę internetową zawierającą wiele skryptów, z których wszystkie używają zaczepu akcji wp_head do drukowania kodu HTML (np. sekcji <style> lub <script> ) w sekcji <head> w interfejsie strony.

W ten sposób kilku twórców wtyczek może realizować wiele celów równolegle w jednej wtyczce lub podzielić wtyczkę na wiele prostszych pojedynczych wtyczek. Jeśli funkcja nie działa poprawnie, możemy bezpośrednio zbadać i debugować jej zahaczoną funkcję bez konieczności przeszukiwania całego projektu.

działania

Akcja uruchamia kod, gdy w WordPressie wystąpi zdarzenie. Akcje mogą wykonywać operacje, takie jak:

• Tworzenie danych.
• Odczytywanie danych.
• Modyfikowanie danych.
• Usuwanie danych.
• Zapis uprawnień zalogowanych użytkowników.
• Śledzenie lokalizacji i przechowywanie ich w bazie danych.

Przykłady zdarzeń, w których mogą zostać wywołane akcje, obejmują:

• init , po załadowaniu WordPressa, ale przed wysłaniem nagłówków do strumienia wyjściowego.
• save_post , gdy post został zapisany.
• wp_create_nav_menu , zaraz po pomyślnym utworzeniu menu nawigacyjnego.

Akcja może wchodzić w interakcję z interfejsem API w celu przesyłania danych (np. link do posta w mediach społecznościowych), ale nie zwróci danych do haka wywołującego.

Załóżmy, że chcielibyśmy zautomatyzować udostępnianie wszystkich nowych postów w naszej witrynie za pośrednictwem mediów społecznościowych. Rozpocznij od przejrzenia dokumentacji WordPressa pod kątem haka, który może zostać uruchomiony po opublikowaniu posta.

Nie ma drogi na skróty do znalezienia naszego haczyka: uczylibyśmy się przez doświadczenie lub przeglądalibyśmy wymienione działania, aby znaleźć prawdopodobnych kandydatów. Moglibyśmy rozważyć save_post jako kandydata, ale szybko go wykluczmy, ponieważ wywołałoby to wiele razy podczas jednej sesji edycji. Lepszym wyborem jest transition_post_status , który jest wyzwalany tylko wtedy, gdy zmieni się status postu (np. z draft na publish publish trash ).

Pójdziemy z transition_post_status , ale również dopracujemy naszą akcję, aby była uruchamiana tylko wtedy, gdy stan naszych przejść do postu zostanie publish . Ponadto, postępując zgodnie z oficjalną dokumentacją i interfejsami API różnych platform mediów społecznościowych, możemy zintegrować i opublikować treść naszego posta wraz z polecanym obrazem:

 <?php function publish_post_on_social_media ( $new_status = NULL, $old_status = NULL, $post_ID = NULL ) { if ( 'publish' == $new_status && 'publish' != $old_status ) { // build the logic to share on social media } } add_action( 'transition_post_status', 'publish_post_on_social_media', 10, 3 ); ?>

Teraz, gdy wiemy, jak używać haków akcji, jest jeden, który jest szczególnie pomocny, zwłaszcza jeśli chodzi o CSS.

Wyznaczanie priorytetów za pomocą wp_enqueue_scripts

Powiedzmy, że chcemy dodać arkusz stylów naszego motywu potomnego jako ostatni, po załadowaniu wszystkich innych, aby upewnić się, że wszelkie klasy o tej samej nazwie pochodzące z innych miejsc są nadpisane przez klasy naszego motywu potomnego.

WordPress ładuje arkusze stylów w domyślnej kolejności:

1. Temat nadrzędny
2. Motyw dziecięcy
3. Wszelkie wtyczki

W tej konstrukcji:

 add_action( string $hook_name, callable $callback, int $priority = 10, int $accepted_args = 1)

…wartość priority dodanej akcji determinuje kolejność jej wykonania:

• Domyślna wartość priority dla wp_enqueue_scripts (lub dowolnej akcji) to „10”.
• Funkcja działa wcześniej, jeśli zresetujemy jej priority na niższy numer.
• Funkcja działa później, jeśli zresetujemy jej priority na wyższy numer.

Aby załadować arkusz stylów naszego motywu potomnego jako ostatni, użyj wp_enqueue_scripts , akcji często używanej przez motywy i wtyczki WordPress. Musimy tylko zmienić priorytet akcji naszego motywu wp_enqueue_scripts na liczbę wyższą niż domyślna „10”, powiedzmy „99”:

 add_action( 'wp_enqueue_scripts', 'child_theme_styles', 99 );

Ogólnie rzecz biorąc, używamy akcji, gdy nie szukamy wartości zwracanych. Aby zwrócić dane do haka wywołującego, musimy spojrzeć na filtry.

Filtry

Filtr pozwala nam modyfikować dane przed ich przetworzeniem w celu wyświetlenia w przeglądarce. W tym celu filtr akceptuje zmienne, modyfikuje przekazane wartości i zwraca dane do dalszego przetwarzania.

WordPress sprawdza i wykonuje wszystkie zarejestrowane filtry przed przygotowaniem treści dla przeglądarek. W ten sposób możemy manipulować danymi przed wysłaniem ich odpowiednio do przeglądarki lub bazy danych.

Jeden z moich klientów personalizuje sprzedawane przez siebie produkty, umieszczając na nich obrazy dostarczone przez klientów. Ten klient używa wtyczki WooCommerce do zarządzania e-commerce. WooCommerce nie obsługuje tej funkcjonalności po wyjęciu z pudełka. Dlatego dodałem dwa bity kodu do functions.php mojego klienta :

1. woocommerce_checkout_cart_item_quantity , wymienione w dokumentacji WooCommerce, to haczyk filtrujący, który umożliwia klientom dodawanie zewnętrznych elementów do ich koszyków przed dokonaniem zakupu.
2. my_customer_image_data_in_cart to filtr, który sami napiszemy i użyjemy do wywołania woocommerce_checkout_cart_item_quantity za każdym razem, gdy WooCommerce przygotuje koszyk do wyświetlenia.

Korzystając z poniższego szablonu możemy dodać dodać nasz filtr i zmodyfikować domyślne zachowanie koszyka:

 add_filter( 'woocommerce_checkout_cart_item_quantity', 'my_customer_image_data_in_cart', 1, 3 ); function my_customer_image_data_in_cart( $html, $cart_item, $cart_item_key ) { if ( !empty( $cart_item['images_data'] ) ) { // Store image // Get image URL // Modify $html } return $html; }

Filtry dodajemy w ten sam sposób, w jaki dodajemy akcje. Filtry działają podobnie do akcji, w tym sposób przetwarzania priorytetów. Główna różnica między filtrami a akcjami polega na tym, że akcja nie zwróci danych do haka wywołującego, ale filtr to zrobi.

Dostosowane haki akcji i haki filtrów

Pisanie niestandardowych hooków akcji nie rozszerza Wordpress Core, a jedynie tworzy nowe punkty wyzwalania w naszym własnym kodzie.

Tworzenie niestandardowych haków akcji

Dodanie niestandardowego zaczepu w naszym motywie lub wtyczce pozwala innym programistom na rozszerzenie funkcjonalności bez modyfikowania naszej bazy kodu. Aby dodać niestandardowy hook, użyj tej samej techniki, której używa sama baza kodu WordPress Core: W pożądanym punkcie wyzwalania po prostu wywołujemy do_action z nazwą naszego nowego haka, opcjonalnie dodając tyle argumentów, ile nasze wywołania zwrotne mogą okazać się przydatne:

 do_action( 'myorg_hello_action', $arg1, $arg2 );

Ten kod po prostu uruchamia wszelkie funkcje zwrotne, które zostały podpięte do naszego niestandardowego podpięcia. Zauważ, że przestrzeń nazw jest globalna, więc, jak sugerowano wcześniej, dobrym pomysłem byłoby poprzedzenie naszych niestandardowych nazw haków skróconą formą nazwy naszej organizacji (i być może również naszego projektu), stąd myorg_ tutaj.

Teraz, gdy zdefiniowaliśmy myorg_hello_action , programiści mogą się do niego podłączyć dokładnie w taki sam sposób, jak omówiliśmy wcześniej dla wbudowanych zaczepów: zdefiniuj funkcję, a następnie wywołaj add_action() .

O ile nie chcemy używać nowego hooka wyłącznie wewnętrznie — w końcu jest to pomocny sposób na ustrukturyzowanie naszego kodu — będziemy musieli przekazać jego dostępność dalej, innym członkom naszego zespołu lub zewnętrznym użytkownikom naszej wtyczki, za pośrednictwem przejrzystej dokumentacji .

Tworzenie niestandardowych haków filtrów

Wzorzec WordPressa dla haków niestandardowych filtrów jest taki sam jak haków akcji, z wyjątkiem tego, że wywołujemy apply_filters() zamiast do_action() .

Przeanalizujmy tym razem bardziej konkretny przykład. Załóżmy, że nasza wtyczka tworzy menu paska bocznego, które zwykle składa się z czterech elementów. Dodamy niestandardowy hak filtra, abyśmy my (i dalsi programiści) mogli modyfikować tę listę elementów w innym miejscu:

 // Text labels of sidebar menu $sidebar_menu = array( "Page One", "Page Two", "Page Three", "Page Four" ); $sidebar_menu = apply_filters( 'myorg_sidebar_menu', $sidebar_menu );

To wszystko — nasz niestandardowy zaczep filtra myorg_sidebar_menu jest teraz gotowy do użycia we wtyczce, którą można załadować później lub w innym miejscu. Pozwala to każdemu piszącemu kod na dostosowanie naszego paska bocznego.

My lub inni programiści zastosujemy ten sam wzór, korzystając z wbudowanego haka WordPress. Innymi słowy, zaczniemy od zdefiniowania niektórych funkcji zwrotnych, które zwracają zmodyfikowaną wersję przekazywanych danych:

 function lowercase_sidebar_menu( $menu ) { $menu = array_map( 'strtolower', $menu ); return $menu; } function add_donate_item( $menu ) { $menu = array_push( $menu, 'Donate' ); return $menu; }

Podobnie jak w przypadku naszych wcześniejszych przykładów, jesteśmy teraz gotowi do podpięcia funkcji zwrotnych filtrów do naszego niestandardowego podpięcia:

 add_filter( 'myorg_sidebar_menu', 'add_donate_item', 100 ); add_filter( 'myorg_sidebar_menu', 'lowercase_sidebar_menu' );

Dzięki temu podczepiliśmy nasze dwie przykładowe funkcje zwrotne do naszego niestandardowego haka filtra. Oba modyfikują teraz oryginalną zawartość $the_sidebar_menu . Ponieważ nadaliśmy wyższy priority add_donate_item , jest on uruchamiany później, po wykonaniu polecenia lowercase_sidebar_menu .

Dalsi programiści mogą zawsze podłączyć więcej funkcji zwrotnych do myorg_sidebar_menu . Tak jak to robią, mogą użyć parametru priority , aby ich podpięcia były uruchamiane przed, po lub pomiędzy naszymi dwoma przykładowymi funkcjami zwrotnymi.

Niebo jest granicą dzięki działaniom i filtrom

Dzięki akcjom, filtrom i haczykom funkcjonalność WordPressa może rosnąć skokowo. Możemy opracować niestandardowe funkcje dla naszej witryny, pozostawiając nasz własny wkład tak samo rozszerzalny jak WordPress. Hooki pozwalają nam stosować się do bezpieczeństwa i najlepszych praktyk, gdy przenosimy naszą witrynę WordPress na wyższy poziom.

Blog Toptal Engineering wyraża wdzięczność Fahadowi Murtazie za jego wiedzę fachową, testy beta i przegląd techniczny tego artykułu.