publikacja: 10 czerwca 2011, autor: , komentarzy 29 http://wpninja.pl/artykuly/wp_head-i-wp_footer-dwie-funkcje-o-ktorych-zawsze-powinienes-pamietac/

wp_head i wp_footer – dwie funkcje, o których zawsze powinieneś pamiętać

wp_head i wp_footer – dwie funkcje, o których zawsze powinieneś pamiętać fot. brieuc_s

wp_head i wp_footer to jedne z najważniejszych elementów motywu WordPressa. Niestety są one zadziwiająco często pomijane czego efektem są późniejsze problemy z poprawnym działaniem całej masy wtyczek.

Dlaczego to takie ważne?

Obie funkcje wskazują miejsca uruchomienia specjalnych action hooks. W uproszczeniu są po prostu miejscami, do których można dobrać się bez konieczności edycji plików motywu. Wykorzystują to głównie wtyczki, które do poprawnego działania potrzebują dodatkowych stylów, skryptów czy meta tagów.

Brak wywołań funkcji to jeden z najczęstszych problemów z działaniem jakiejś wtyczki. Dotyczy to znacznej mierze motywów przygotowywanych pod indywidualne zamówienie choć zdarzają się i takie, które są ogólnodostępne.

wp_head

Funkcja wp_head powinna być wywołana w nagłówku strony, tuż przed zakończeniem znacznika HEAD w pliku header.php. Przykładowy nagłówek ilustrujący konkretne miejsce (5. wiersz):

<!DOCTYPE HTML>
<html <?php language_attributes() ?>>
<head>
<meta charset="<?php bloginfo('charset') ?>" />
<?php wp_head() ?>
</head>
<body>

wp_footer

Funkcja wp_footer powinna być wywołana w stopce strony, tuż przed zakończeniem znacznika BODY w pliku footer.php. Przykładowa stopka ilustrująca konkretne miejsce (1. wiersz):

<?php wp_footer() ?>
</body>
</html>

Dlaczego tak łatwo o tym zapomnieć?

Tłumaczenia są różne – „bo mój kod działa poprawnie i bez tego”, „bo chciałem mieć większą kontrolę nad kodem” czy po prostu „bo nie wiedziałem, że coś takiego istnieje”. Wszystkie wynikają z braku dostatecznej wiedzy na temat funkcjonowania WordPressa. Wiem, bo sam przez to przeszedłem.

Faktycznie, funkcja wp_head już na starcie potrafi wypluć parę dodatkowych linijek kodu HTML, które nie zawsze są potrzebne do szczęścia. W następnym artykule pokażę jak się ich pozbyć w poprawny sposób i jak wykorzystać możliwości wspomnianych funkcji w praktyce.

Komentarze

  1. ChemikPIL 5 lat temu:

    Przyznam się, że nie korzystam z tych funkcji, ale tylko dlatego, że jestem świadom ich działania i w 100% pewien, że nie potrzebuje ich do niczego. Dwa niepotrzebne wywołania mniej :)

    odpowiedz
    1. ChemikPIL 5 lat temu:

      Oczywiście nie wykorzystuje ich na swoim blogu :) Gdzie indziej już tak :D

      odpowiedz
    2. Szymon Skulimowski 5 lat temu:

      Zaczekaj tylko na następne artykuły a zmienisz zdanie :-).

      odpowiedz
    3. konradk - wpzlecenia.pl 5 lat temu:

      przegapianie tego to faktycznie niezbyt sprytne rozwiazanie. naprawde tak robisz i klienci ci nie zglaszaja, ze cos im nie dziala (najczesciej jakas wtyczka)?

      odpowiedz
    4. ChemikPIL 5 lat temu:

      Nie stosuje tych funkcji tylko na swoim blogu :) Jeżeli chodzi o themy szykowane dla osób trzecich to jak najbardziej je umieszczam.

      odpowiedz
  2. konradk - wpzlecenia.pl 5 lat temu:

    hmm, od wp 3.1 chyba juz sie nie da ich przegapic :) w przeciwnym wypadku najczesciej sie to konczy bialym pasem u gory strony dla zalogowanego usera (tam gdzie powinno byc menu szybkiego dostepu do kokpitu)

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Pasek administracyjny powiązany jest i z wp_head (style) i z wp_footer (kod HTML i skrypt JS). Jeśli nie mamy obu funkcji to nie zobaczymy nic. Jeśli mamy tylko wp_head to zobaczymy biały pasek, a jeśli tylko wp_footer to zobaczymy sam kod HTML / JS.

      odpowiedz
    2. konradk - wpzlecenia.pl 5 lat temu:

      Szymon, jesli wstawisz wp_head ale bez wp_footer, zobaczysz pusty bialy pas :)

      odpowiedz
    3. Szymon Skulimowski 5 lat temu:

      Zgadza się, czyli tak jak napisałem wcześniej :-).

      odpowiedz
  3. SQ7JZI 5 lat temu:

    Z niecierpliwością więc czekam na ciąg dalszy, czyli praktykę.

    odpowiedz
  4. SpeX 5 lat temu:

    No w końcu jakiś ruchu na blogu, bo ostatnio to marnie z nim.

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Musiałem zrealizować swój plan przejęcia kontroli nad światem, stąd te przestoje.

      odpowiedz
  5. macias 5 lat temu:

    Podpisuję się pod wpisem wszystkimi kończynami. Należy stosować wp_head() i wp_footer() i to nie podlega dyskusji. Jeśli komuś zależy na elastycznej templatce i nie chce mieć problemów w przyszłości, nie warto eksperymentować. A zbędne linijki kodu można naprawdę łatwo usunąć. Czy spotkałeś się kiedyś z sytuacją, która wymagała zamieszczenia wp_head() nie przed samym zamknięciem znacznika ? Ja się spotkałem. :)

    odpowiedz
    1. Szymon Skulimowski 5 lat temu:

      Nie, nie miałem takiej sytuacji. Mógłbyś podać więcej szczegółów?

      odpowiedz
    2. macias 5 lat temu:

      To był czerwiec 2011 roku, wieczór był ciepły, słońce chyliło się ku zachodowi… :) Ej nie, sorry, nie wiem co mi się ubzdurało. :P Teraz zerknąłem w bebechy i jednak wp_head() jest przed zamknięciem heda.

      odpowiedz
  6. Odin 5 lat temu:

    No tak!
    Po przeczytaniu tego wpisu dopiero do mnie dotarło :)

    Od jakiegoś czasu w wolnych chwilach tworzę theme’a, poprawiałem kod w footer.php, zapisałem zmiany i musiałem kończyć. Nie sprawdziłem czy wszystko działa ok, po kilku dniach wróciłem do projektu i patrze, że mam jakiś dziwny margin u góry i nie wyświetla mi się plugin social-slider2. Kombinowałem z wszystkim, sprawdzałem zamknięcia div’ów, w css, itd. Ale ciągle nic… w końcu wkurzyłem się i tymczasowo ustawiłem margin-top: -xx; oraz dodałem kod php social slidera do kodu theme’a…

    A najprawdopodobniej problemem było to, że usunąłem właśnie wp_footer :) Muszę to jutro sprawdzić…
    Dzięki.

    odpowiedz
  7. NetReview.pl 5 lat temu:

    Przydatne. Staram się korzystać z tych funkcji ale przy niektórych skryptach muszę odpuścić.

    odpowiedz
  8. Tomasz Gąsior 5 lat temu:

    Teraz już wiem dlaczego wtyczki nie działały mi prawidłowo!
    Dzięki za wpis! :)

    odpowiedz
  9. Anetka 5 lat temu:

    i moje problemy się rozwiązały wystarczyło przeczytać ten artykuł, a ja się tyle męczyłam że mi coś nie chcę działać ehh

    odpowiedz
  10. Marcin 5 lat temu:

    Czekam z niecierpliwością na artykuł o zarządzaniu hook’ami :) Może też coś wspomnieć o pisaniu własnych?

    BTW. Coś cicho o WorcCamp – Polska 2011

    odpowiedz
  11. tanie loty 5 lat temu:

    Dobrze czasem poczytać blogi kolegów specjalistów :)

    odpowiedz
  12. Paweł 11 miesięcy temu:

    Witam

    Po dodaniu przed pojawia mi się na stronie błąd i jednocześnie nie wyświetla się poziomy pasek z menu. Bez tej funkcji działa OK, ale nie działają niektóre wtyczki na których mi zależy.

    Wyświetlany błąd: Warning: call_user_func_array() expects parameter 1 to be a valid callback, function ‚ample_scripts’ not found or invalid function name in /virtual/spwarmiak.pl/wp-includes/plugin.php on line 525

    Pozdrawiam i proszę o pilną pomoc.

    odpowiedz
    1. Szymon Skulimowski 11 miesięcy temu:

      Hej Paweł! Czy mógłbyś sprecyzować – „po dodaniu przed” – co dodałeś przed czym?

      odpowiedz
    2. Paweł 11 miesięcy temu:

      Po dodaniu wp_head przed zamykającym znacznikiem /head.

      odpowiedz
    3. Szymon Skulimowski 11 miesięcy temu:

      W pierwszej kolejności – przeszukaj wszystkie pliki pod kątem frazy „ample_scripts” (np. korzystając z Agent Ransack).

      Najprawdopodobniej to pozostałość po wcześniejszym kodzie – usunąłeś funkcję „ample_scripts”, ale zostawiłeś gdzieś jej wywołanie podczepione pod akcję (add_action) lub filtr (add_filter).

      Jest też inna możliwość – możliwe, że przy wywołaniu podałeś błędną nazwę – zamiast „ample_scripts” powinno być „sample_scripts”?

      odpowiedz
    4. Paweł 11 miesięcy temu:

      Dziękuję, pomogło.
      Próbowałem poprawnie dołączyć plik .js i w pliku function.php umieściłem:
      function nazwaszablonu_scripts() {
      wp_enqueue_script( ‚skrypty-js’, get_template_directory_uri() . ‚/js/skrypty.js’, array( ‚jquery’ ), 1.0, true );
      }
      add_action( ‚wp_enqueue_scripts’, ‚ample_scripts’ );

      Wtyczki już działają, ale skrypty.js nadal dołączone mam tradycyjnie: <script src=”http://spwarmiak.pl/wp-content/themes/moj_szablonik/skrypty.js”></script>
      bo powyższy sposób nie działał.
      Pozdrawiam i jeszcze raz dziękuję.

      odpowiedz

Dodaj własny komentarz

Odnośniki z innych stron

Lista innych stron, które w jakiś sposób odnoszą się do opublikowanej tutaj treści:

  1. WordPress jako CMS – najczęstsze błędy deweloperów | Wodospad kolorów

    […] Przygotuj motyw na współpracę z pluginami. Nie użyłeś funkcji wp_head() i wp_footer()? O przykrych konsekwencjach tego błędu pisze WP Ninja w artykule: wp_head i wp_footer – dwie funkcje, o których zawsze powinieneś pamiętać. […]

  2. Easy Columns czyli proste dzielenie treści wpisu WordPressa na kolumny | WPNinja

    […] Praktycznie, wtyczka Easy Columns to gotowe rozwiązanie, które działa tuż po instalacji co jest szczególnie ważne przy ograniczonym czasie czy budżecie. Zasada jej działania opiera się o gotowe zestawy shortcodów wraz ze stylami CSS2 (warto więc pamiętać o wp_head). […]

  3. Dodawanie CSS / JS do WordPressa – wprowadzenie | WPNinja

    […] momencie zacząłem sobie z tym „radzić” poprzez całkowite usuwanie funkcji wp_head i wp_footer, które dają wtyczkom możliwość dołączania własnych stylów i skryptów. Oczywiście […]