WordPress gromadzi wiele plików szablonów PHP, aby renderować zawartość czytelną dla użytkownika w przeglądarce.Motywy WordPress zawierają pliki header.php, footer.php, single.php (dla postów), page.php (dla stron) i sidebar.php, najnowsze motywy wykorzystują dodatkowe sekcje szablonów do generowania głównej treści.
Wszystkie te szablony są starannie składane i wyświetlane podczas przeglądania strony WordPress w przeglądarce.Zazwyczaj nie trzeba modyfikować tych plików, a dostępne są wtyczki umożliwiające wstawianie niestandardowych funkcji.Jednak w niektórych przypadkach musisz wstawić kod w sekcjach nagłówka i stopki WordPressa.
W tym artykule wyjaśnimy, jak to zrobić bez i z wtyczkami.
Po co wstawiać kod w nagłówku lub stopce?
Sekcje nagłówka i stopki są przydatne do integracji różnych kodów i dodawania dodatkowych funkcji do Twojej witryny.Oto niektóre z najlepszych przykładów, które wymagają wstawienia kodu w nagłówku i stopce witryny WordPress.
Wstaw kod reklamy automatycznej z Google AdSense lub kod reklamy ze stawkami w mastheadach z dowolnego innego programu reklamowego.
Zainstaluj kod śledzenia Google Analytics i Facebook Pixel.
Wstaw captcha z Bing Webmaster Tools, Google Search Console, Baidu, Yandex i dowolnej innej platformy, takiej jak Pinterest.
Dodaj niestandardowe CSS do nagłówka, takie jak arkusze stylów Google Fonts i JavaScript w stopce.
Wstaw niestandardowe komponenty, takie jak bułka tarta, w nagłówku podczas korzystania z wtyczek, takich jak Yoast SEO.
Jak widzisz, lista będzie dłuższa w zależności od Twoich potrzeb.
Dodaj kod do sekcji nagłówka i stopki w WordPress
Domyślnie WordPress nie zapewnia żadnej opcji wstawiania kodu w sekcjach nagłówka i stopki.Prostą opcją jest bezpośrednia edycja pliku i wstawienie kodu.Dostępne są jednak również wtyczki do tego celu.W tym artykule wyjaśnimy dwa sposoby dodawania kodu do sekcji nagłówka i stopki dowolnej witryny WordPress.
Ręcznie edytuj pliki header.php i footer.php motywu WordPress.
Użyj wtyczki Insert Header and Footer, aby dodać kod bez edycji pliku.
Ponadto wyjaśnimy użycie niektórych motywów do wstawiania kodu w nagłówkach i stopkach za pomocą zaczepów wp_head i wp_footer.
Ręcznie wstaw kod nagłówka i stopki WordPress
Ta opcja wymaga edycji pliku header.php lub footer.php w motywie witryny WordPress i może nie być przyjazna dla początkujących.
Najpierw zacznij od przygotowania fragmentów kodu lub kopiowania z witryn innych firm.Po przygotowaniu kodu nagłówka i stopki najedź kursorem na menu Wygląd na pulpicie nawigacyjnym witryny i kliknij kartę Edytor motywów.
Zignoruj wszelkie otrzymane komunikaty ostrzegawcze i wybierz aktywny temat z listy rozwijanej „Wybierz temat do edycji:”.
Wybierz plik „header.php” lub „footer.php” po prawej stronie bieżącego widoku.
W przypadku nagłówka wklej kod pod zamykającym tagiem „”, a kod stopki powinien znajdować się pod „" Etykieta.Czasami może być konieczne wstawienie kodu przed tagiem zamykającym.
Na koniec kliknij przycisk „Aktualizuj plik”, aby zapisać zmiany w witrynie z dodanym fragmentem kodu.
Przetestuj swoją witrynę i sprawdź, czy podłączone funkcje działają zgodnie z oczekiwaniami.
Wstaw kod nagłówka i stopki WordPress za pomocą wtyczek
Domyślnie WordPress umożliwia dodawanie niestandardowego CSS do Twojej witryny w sekcji Wygląd > Dostosowanie > Dodatkowy CSS.Jednak nie możesz wstawić JavaScript w tej sekcji.Dostępnych jest wiele bezpłatnych wtyczek i wtyczek do wstawiania kodu, tutaj wyjaśnimy za pomocą „WPBeginner Insert Header and Footer”.Wtyczka ma bardzo prosty interfejs, z którego mogą z łatwością korzystać początkujący.
Najpierw zainstaluj i aktywuj wtyczkę „Wstaw nagłówek i stopkę”.Na pulpicie WordPress najedź kursorem na menu Wtyczki i kliknij Dodaj nowy.
Użyj funkcji wtyczki wyszukiwania, aby znaleźć „Wstaw nagłówek i stopkę” i kliknij przycisk „Zainstaluj teraz”.Po zakończeniu procesu instalacji „Aktywuj” wtyczkę.
Zainstaluj wtyczkę
Przejdź do menu Ustawienia, znajdź i kliknij podmenu Wstaw nagłówek i stopkę.
Wtyczka udostępnia trzy pola do umieszczania skryptów w nagłówku, treści i stopce w celu wstawienia kodu.Do tego czasu dostawcy zewnętrzni, tacy jak Google Analytics, instruują Cię, w którym polu należy umieścić ich fragmenty kodu.W przeciwnym razie upewnij się, że dokładnie wiesz, gdzie chcesz wstawić kod.
Wklej te kody do odpowiednich kodów i kliknij Zapisz, aby zakończyć zmiany w witrynie.
Skrypty kodu są teraz automatycznie ładowane do określonej lokalizacji, w której działa witryna.
Zawsze możesz edytować kod dalej i pozostawić wtyczkę aktywną, ponieważ jej dezaktywacja uniemożliwi dodawanie niestandardowych funkcji i wyłączy wszystkie skrypty dodane wcześniej do Twojej witryny.
Wstaw kod za pomocą wtyczek
Pamiętaj, że jeśli przypadkowo wtyczka „Wstaw nagłówek i stopkę” zostanie dezaktywowana lub przez pomyłka odinstalowana, Twój kod pozostanie w bazie danych Twojej witryny.Wystarczy ponownie zainstalować lub ponownie aktywować wtyczkę, aby wcześniejszy kod działał.Zaleca się również wyczyszczenie pamięci podręcznej witryny WordPress podczas dodawania i zapisywania zmian we fragmentach kodu nagłówka i stopki we wtyczce.
Edytuj nagłówki i stopki za pomocą motywów
Niezależnie od tego, czy edytujesz pliki motywów ręcznie, czy używasz wtyczki, wstawiony kod wpływa na całą witrynę.Musisz użyć wtyczek, takich jak Wstaw fragmenty HTML lub wypróbować niestandardowe bloki HTML w edytorze Gutenberg, aby wstawić niestandardowy kod tylko w określonych postach lub stronach.Możesz jednak wstawić kod w nagłówkach i stopkach z najnowszymi motywami, takimi jak GeneratePress Premium i Astra Pro.Te motywy używają standardowych zaczepów wp_head i wp_footer i umożliwiają stosowanie niestandardowych ograniczeń.Na przykład możesz po prostu wstawić bułkę tartą w jednym poście bez wpływu na stronę.
Tutaj użyjemy motywu Astra Pro do instrukcji, możesz wykonać podobne kroki w motywie GeneratePress Premium za pomocą opcji „Elementy”.
Po zainstalowaniu dodatku Astra Pro przejdź do Wygląd > Opcje Astry.
Aktywuj opcję Układ niestandardowy i kliknij łącze Ustawienia dla tej opcji.
Kliknij przycisk „Dodaj nowy” i wklej w polu kod, który chcesz wstawić.
W sekcji Ustawienia układu niestandardowego kliknij menu rozwijane Układ i wybierz opcję Haki.
Wstaw kod nagłówka w motywie Astra
Z listy rozwijanej Akcja wybierz wp_head dla sekcji nagłówka i wp_footer dla sekcji stopki.
Jeśli używasz tylko jednego fragmentu, pozostaw pole „priorytet” puste.Jeśli jednak wstawiasz wiele kodów w tym samym miejscu zaczepienia, upewnij się, że ustawiłeś kolejność wstawiania kodów.Możesz użyć 10, 20, 30 itd. jako priorytetu, najniższy będzie miał pierwszeństwo przed pozostałymi.
W razie potrzeby podaj szczegóły odstępów na górze i na dole w pikselach.
Wybierz miejsce, w którym chcesz wyświetlić kod w menu rozwijanym Wyświetl przy.Możesz wybrać określone posty, strony, kategorie lub wstawić całą witrynę lub wstawić określone typy postów, takie jak posty, strony lub dowolny niestandardowy typ posta używany w Twojej witrynie.
Z listy rozwijanej Rola użytkownika wybierz rolę użytkownika, dla której kod ma być aktywny.
Po zakończeniu wszystkich ustawień kliknij przycisk Opublikuj, aby zmiany zaczęły obowiązywać.
Powody, dla których warto używać wtyczki Insert Header and Footer
Istnieje tak wiele wad edytowania plików motywów lub korzystania z niestandardowego motywu, że pozostaniesz przy podejściu wtyczek.Oto niektóre z korzyści, jakie możesz uzyskać z korzystania z wtyczki, z wyjątkiem tego, że możesz nie być technikiem lub możesz być początkującym.
Ponieważ sklep wtyczek dodaje skrypty w osobnej lokalizacji, nie musisz się martwić o wymazywanie kodu podczas aktualizacji, aktualizacji lub zmiany motywów.Nie potrzebujesz również motywów podrzędnych, ponieważ wtyczka działa niezależnie od motywu Twojej witryny.
Dzięki temu dodawanie własnego kodu w nagłówkach i stopkach jest łatwe i szybkie.Ponadto pomaga to w utrzymaniu organizacji fragmentów kodu w jednej lokalizacji.
Podczas edycji motywu WordPress mogą wystąpić błędy, więc użycie wtyczki może pomóc w zapobieganiu i unikaniu takich błędów.
końcowe przemyślenia
W wielu przypadkach musisz zmienić wygląd, zmienić sposób lub dodać inne funkcje do swojej witryny WordPress.W obu przypadkach, jeśli nie masz ochoty technicznej, pamiętaj, aby użyć metody wtyczki do wstawienia kodu nagłówka i stopki.Chociaż motywy takie jak Astra i GeneratePress mogą Ci w tym pomóc, musisz kupić wersję premium.Może to również utrudnić zmianę motywów, w którym to momencie będziesz musiał szukać wtyczek do użycia.
