Dodaj Javascript do witryny WordPress — 7 metod krok po kroku

Dodaj JavaScript do WordPressa

Zwykle istnieje wiele powodów, dla których chcesz dodać Javascript do WordPressa, albo drobne poprawki do funkcji, albo może chcesz dodać skrypt innej firmy. Szacunekless z powodów, dla których chcesz to zrobić, chcesz się upewnić, że się nie pomylisz - ponieważ możesz zepsuć swoją witrynę lub stworzyć wąskie gardło wydajności.

Bezpośrednie dodawanie kodu JavaScript do stron i postów WordPress nie jest możliwe, dlatego zasugerujemy kilka różnych sposobów dodawania kodu JavaScript do stron internetowych i które z nich powinny być używane w różnych sytuacjach, z jakimi możesz się spotkać. 

Jeśli się spieszysz, skorzystaj z poniższego spisu treści, aby przewinąć do odpowiedniej części artykułu.

 

Ten artykuł zawiera zmiany w kodzie WordPress. Jeśli nie masz pewności, czy samodzielnie poprawisz kod, możesz to zrobić dowiedz się, jak rekrutować najlepszego programistę WordPress dla Twojej firmy lub sprawdź następujące tanie opcje rozwoju. 

Jeśli nie masz pewności, czy to jest odpowiednie dla Ciebie i co zrobić, aby to zrobić szybko, sprawdź kilka koncertów Fiverr, które mogą to zrobić szybko za Ciebie

logo piątki

Kliknij tutaj, aby znaleźć tanich ekspertów od poprawek WordPress

Co to jest JavaScript?

Jeśli czytasz ten post, prawdopodobnie już wiesz, czym jest JavaScript.

Aby jednak był dostępny dla wszystkich, szybko wyjaśnimy, czym jest JavaScript i co robi. Możesz pominąć tę część, jeśli już wiesz.

JavaScript to język programowania działający w przeglądarce. Można go wywołać z serwera WWW, ale działa on w przeglądarce odwiedzającego.

Zapewnia to całkiem spore możliwości robienia fajnych rzeczy, takich jak osadzanie wideo i dodawanie funkcji.

Możesz na przykład użyć JavaScript do osadzenia odtwarzacza wideo, aby Twój serwer internetowy nie musiał tego robić.

Poprawia to wrażenia użytkownika, dołączając wideo, bez obciążania serwera WWW w celu odtwarzania wideo.

JavaScript jest również używany w aplikacjach mobilnych, grach, aplikacjach serwerowych, programowaniu front-end, a ostatnio w programowaniu związanym ze sztuczną inteligencją.

Czy możesz używać JavaScript w WordPressie?

Tak, możesz używać JavaScript w WordPressie. Biorąc pod uwagę naturalną elastyczność systemu CMS, możesz używać JavaScript do dodawania elementów interaktywnych lub umieszczania interfejsów API innych firm na stronie.

Zastosowania są liczne i różnorodne, ale ponieważ JavaScript jest uruchamiany przez przeglądarkę użytkownika, może wiele zdziałać bez spowalniania serwera WWW.

Możesz dodać skrypt na wiele sposobów, które omówimy za chwilę.

Przed wprowadzeniem jakichkolwiek zmian w plikach zalecamy utworzenie motywu potomnego i/lub utworzenie kopii zapasowej witryny.

Nie możesz być zbyt ostrożny!

Jak dodać JavaScript do WordPressa

Istnieje wiele sposobów na dodanie niestandardowego kodu JavaScript do witryny WordPress, z których każdy ma swoje własne zastosowania:

  1. Dodaj skrypt do wybranych stron za pomocą wtyczki, takiej jak WPCode
  2. Dodaj skrypt do określonej lub pojedynczej wybranej strony lub wielu stron za pomocą functions.php
  3. Dodaj JavaScript do wszystkich stron
  4. Dodaj plik JavaScript do nagłówka motywu
  5. Korzystanie z haka wp_head w celu dodania niestandardowego kodu JavaScript
  6. Dodaj JavaScript do stopki WordPress
  7. Dodawanie JavaScript do wideo WordPress
  8. Dodaj JavaScript do widżetu WordPress

Przyjrzyjmy się szczegółowo każdej z tych metod.

Następnie szybko pokażemy, jak debugować JavaScript po dodaniu go do strony.

Note: Niektóre z tych technik obejmują wprowadzanie zmian w podstawowych plikach. Chociaż zwykle nie jest dobrym pomysłem zmienianie pliku functions.php i innych podstawowych plików WordPress, chcemy pokazać Ci wszystkie sposoby dodawania kodu.

Niekoniecznie zalecamy wprowadzanie zmian w ten sposób, ale wierzymy w przekazanie wszystkich informacji, a następnie podjęcie własnej decyzji.

1. Użyj wtyczki, takiej jak WPCode

Jeśli chcesz po prostu użyć wtyczki do osadzenia odniesienia javascript do pliku nagłówka lub stopki motywu WordPress, wtyczka WPCode jest łatwą i bezpłatną opcją.

Zalecamy używanie wtyczki do wszystkich zmian w kodzie, ponieważ utrzymuje ona wszystko w czystości i pozwala uniknąć problemów w przyszłości.

Zamiast modyfikować pliki motywu bezpośrednio za pomocą niestandardowego kodu JavaScript, wtyczka umożliwia wstawienie kodu, który zostanie dodany do nagłówka lub stopki witryny, w zależności od wybranych opcji. 

Ta wtyczka obsługuje kilka różnych opcji, więc opiszemy tylko te najczęstsze, których będziesz potrzebować.

Możesz pobierz WPCode tutaj lub zainstaluj go za pomocą funkcji Zainstaluj wtyczki WordPress.

Zainstaluj wtyczkę WPCode:

  • Zaloguj się do zaplecza lub administratora swojej witryny.
  • Iść do Wtyczki > Dodaj nowy
  • Wyszukaj wtyczkę „WPCode” i kliknij zainstaluj teraz.
  • Po zainstalowaniu kliknij Aktywuj

zainstaluj wpcode

 

Możesz teraz załadować niestandardowy skrypt bez pliku (np. aby dodać otrzymany skrypt, taki jak Google Analytics) lub przesłać niestandardowy plik JavaScript. 

Najpopularniejszą opcją, której możesz użyć z tą wtyczką, jest możliwość dodania kodu bezpośrednio do WordPressa.

Można to wykorzystać, gdy korzystasz z usługi innej firmy, takiej jak Google Analytics, Drip lub innego narzędzia, które wymaga dodania skryptu do Twojej witryny. Po prostu weź skrypt i wrzuć go do Globalny nagłówek i stopka okno.

Możesz dodać skrypt do nagłówka, treści lub stopki. Powinieneś otrzymać wskazówki od dostawcy skryptu, do której z tych sekcji musisz dodać skrypt.

Powiedzmy, że chcesz dodać go do nagłówka:

dodawanie kodu javascript do nagłówka wordpress

Kliknij Zapisz zmiany skończyć.

Wtyczka WPCode doda teraz kod do każdej strony Twojej witryny.

Załaduj ponownie interfejs i sprawdź źródło swojej witryny, aby upewnić się, że kod jest teraz wyświetlany. Dobrym pomysłem jest również przejrzenie kilku stron, aby potwierdzić, że wszystko nadal działa dobrze.

WPCode umożliwia również tworzenie własnych fragmentów kodu.

Możesz także wstawiać fragmenty kodu w dowolnym miejscu w swojej witrynie, na przykład wewnątrz postów lub stron, przed lub po poście, przed lub po treści lub wiele innych opcji, których możesz potrzebować.

Po prostu przejdź do Fragmenty kodu > Dodaj fragment a następnie wybierz Stwórz swój własny.

dodaj swój niestandardowy kod

Zostaniesz teraz przeniesiony do Utwórz niestandardowy fragment kodu stronę, na której możesz nadać swojemu kodowi tytuł i wkleić go do pliku Podgląd kodu pudełko.

utwórz niestandardowy fragment kodu javascript

Następnie z Typ kodu menu rozwijane, wybierz Fragment kodu JavaScript.

fragment javascript

Następnie po prostu przewiń w dół, aż dojdziesz do Wprowadzenie powierzchnia.

Pozostaje tylko wybrać lokalizację kodu z rozwijanego menu. Znajdź Strona, post, niestandardowy typ postu i określ, gdzie kod ma się wyświetlać na stronie lub w poście.

Jeśli chcesz, aby WPCode umieścił fragment przed lub po akapicie, możesz określić, który akapit w poście powinien pojawić się przed lub po.

Jeśli na przykład wpiszesz 1 w polu „Wstaw numer”, fragment kodu pojawi się przed lub po pierwszym akapicie. W drugim akapicie użyj 2 i tak dalej.

Następnie po prostu przełącz przełącznik u góry ekranu na Aktywna, a następnie kliknij przycisk Zapisz fragment opcja obok.

To wszystko, czego potrzeba, aby dodać JavaScript do WordPress!

Główną zaletą korzystania z wtyczki jest to, że jest to opcja przyjazna dla początkujących. Nie musisz się martwić edycją plików motywu. Wtyczka WPCode może się również przydać, jeśli szukasz szwuless sposób dodawania innych rodzajów kodu i niestandardowego CSS.

Jednak wadą tej metody jest to, że wiąże się ona z instalacją wtyczki innej firmy, której niektórzy właściciele witryn starają się unikać.

Jeśli chcesz ograniczyć liczbę rozszerzeń do minimum, lepiej skorzystać z jednej z innych metod.  

Chociaż wydaje się to dość proste, może być poza twoją strefą komfortu, więc jeśli chcesz zrobić to szybko, sprawdź niektóre deweloperzy na Fiverrze, który może to za Ciebie zrobić.

logo piątki

Kliknij tutaj, aby znaleźć tanich ekspertów od poprawek WordPress

 

2. Dodaj JavaScript do określonej strony lub posta WordPress

Ta poprawka kodu użyje Funkcje plik znaleziony w folderze szablonu, aby dodać wybrany przez siebie plik .JS tylko do jednej wybranej strony.

Wykorzystuje to IS_PAGE funkcję, którą możesz znaleźć tutaj

W rzeczywistości możesz użyć różnych innych opcji, jeśli chcesz dodać skrypt tylko w określonych warunkach, takich jak:

  • is_single(),
  • is_front_page(),
  • is_home,
  • is_admin itd. 

Jeśli chcesz dodać plik do wszystkich stron, kontynuuj przewijanie, aby znaleźć inne alternatywy dla tej metody poniżej.

    • Najpierw musisz określić identyfikator strony, do której chcesz dodać skrypt.
    • Robisz to wchodząc na stronę, do której chcesz dodać plik, kliknij Edytuj a następnie pobierz identyfikator strony z adresu URL, jak widać poniżej. Identyfikator to numer znaleziony w adresie URL paska przeglądarki.

identyfikator strony wordpress

  • Teraz, gdy masz już identyfikator strony, musisz przesłać plik .js do lokalizacji. Zalecamy przesłanie pliku .js do folderu szablonów, być może w katalogu podrzędnym.
  • Po przesłaniu należy dokładnie zanotować katalog i nazwę pliku .JS, którego używamy zamiast PATH_TO_JS_FILE poniżej. Na przykład Twój plik może znajdować się w: https://www.yourwebsite.com/wp-content/themes/twentynineteen/js/myjsfile.js
  • Zanotuj ten pełny adres URL i zastąp PATH_T_JS_FILE poniżej. Będziesz także musiał wymienić identyfikator, który znalazłeś powyżej.
  • Dodaj pełny kod poniżej na końcu Funkcje plik szablonu.

funkcjonować collectiveray_load_js_script() {
  if( is_page(ID)) {
    wp_enqueue_script('js-file', 'PATH_TO_JS_FILE', array('jquery'), '', false);
    //lub użyj wersji poniżej, jeśli dokładnie wiesz, gdzie znajduje się plik
    //wp_enqueue_script( 'plik-js', get_template_directory_uri() . '/js/myscript.js');
  }
}

add_action('wp_enqueue_scripts', 'collectiveray_load_js_script');

Jeśli dokładnie wiesz, gdzie umieściłeś plik JS, możesz użyć niewielkiej odmiany wp_enqueue_script: 

wp_enqueue_script( 'plik-js', get_template_directory_uri() . '/js/myscript.js');

W takim przypadku plik /js/mysript.js to lokalizacja pliku, który chcesz dodać.

Po ponownym załadowaniu strony okaże się, że plik został dodany. Możesz to potwierdzić, klikając Wyświetl źródło strony.

Jeśli zamiast dodawać plik JavaScript do strony, chcesz dodać go do pojedynczej strony, możemy zastosować niewielką modyfikację tej funkcji, aby zastosować ją do pojedynczego postu. Możesz użyć dowolnej odmiany następujących elementów:

  • is_single( '17' ) - używa identyfikatora posta
  • is_single( 'Mój tytuł posta' ) - używa tytułu posta, aby sprawdzić, czy jest to post, do którego ma zostać dodany plik
  • is_single( 'moj-tytul-post' ) - sprawdza przed ślimakiem słupka
  • is_single( array( 17, 'tytuł-mojego-post', 'Tytuł mojego posta' )) - to sprawdza, czy którykolwiek z warunków identyfikatora posta to "17", slug to "tytuł-mojego-postu" lub tytuł to "Tytuł mojego posta"
  • jest singlem() - inne odmiany funkcji is_single wykorzystujące tablicę wartości do sprawdzenia

Kod w tym przypadku byłby następujący lub niewielką wariacją w zależności od parametrów funkcji is_single. 

funkcjonować collectiveray_load_js_script() {
  if( is_single('17')) {
    wp_enqueue_script('js-file', 'PATH_TO_JS_FILE', array('jquery'), '', false);
    //lub użyj wersji poniżej, jeśli dokładnie wiesz, gdzie znajduje się plik
    //wp_enqueue_script( 'plik-js', get_template_directory_uri() . '/js/myscript.js');
  } 
}

add_action('wp_enqueue_scripts', 'collectiveray_load_js_script');

Jeśli masz tytuł posta, możesz go użyć zamiast parametru „17”. Po raz kolejny wp_enqueue_script można również dostosować do:

wp_enqueue_script( 'plik-js', get_template_directory_uri() . '/js/myscript.js');

3. Dodaj JavaScript do wszystkich stron

Jak widzieliśmy, najłatwiejszą i najczystszą metodą dodania pliku javascript do motywu WordPress jest użycie functions.php plik z wp_enqueue_script.

W tym przypadku, zamiast tworzyć warunek dodawania treści do konkretnych stron, dodamy ogólną funkcję.

Oto jak to zrobić:

Otwórz swoje functions.php plik i skopiuj do niego poniższy fragment kodu. Przed zapisaniem upewnij się, że zastąpiłeś adres URL szablonu swoim własnym.

funkcjonować collectiveray_theme_scripts_function() {
  wp_enqueue_script( 'plik-js', get_template_directory_uri() . '/js/myscript.js');
}
add_action('wp_enqueue_scripts','collectiveray_funkcja_skryptów_motywu');

Jeśli jesteś za pomocą motywu potomnego, musisz użyć get_stylesheet_directory_uri() zamiast get_template_directory_uri() 


Korzystając z tej metody, nie musisz instalować kolejnej wtyczki, jeśli edytujesz plik functions.php. Ta metoda może być również używana do dodawania funkcji i funkcjonalności zarówno do motywu, jak i samego WordPressa. Takie podejście, na przykład, może zainstalować JavaScript w pojedynczym poście lub na stronie lub na wszystkich stronach.

Główną wadą tej strategii jest to, że wymaga ona radzenia sobie z kodem i aktualizowania plików witryny. W rezultacie, jeśli brakuje Ci doświadczenia w tej dziedzinie, może nie być idealną alternatywą.

logo piątki

Kliknij tutaj, aby znaleźć tanich ekspertów od poprawek WordPress

4. Dodaj JavaScript do nagłówka motywu

W niektórych przypadkach możesz chcieć, aby plik JavaScript był używany w całej witrynie, ale nie chcesz używać do tego wtyczki.

Na przykład, jeśli chcesz dodać skrypt innej firmy do wszystkich swoich stron (np. skrypt instantpage.js, aby Twoja witryna działała szybciej), możesz wstawić ten skrypt lub dodać sam plik skryptu, do którego się odwołujesz, w head Twojego header.php plik szablonu. 

TO NIE JEST IDEALNE. Jeśli zaktualizujesz motyw, możesz utracić te zmiany. Jeśli nadal chcesz to zrobić bezpośrednio, zdecydowanie zalecamy utworzenie motywu potomnego.

W tym scenariuszu, w którym chcesz, aby ten skrypt był dodawany wszędzie, możesz dodać plik bezpośrednio do szablonu zgodnie z poniższymi instrukcjami:

To wywołanie pliku (lub skryptu) należy dodać między metatagami a linkiem do arkusza stylów. Jest to dokładnie to samo, co w przypadku dodawania kodu JavaScript na dowolnej stronie HTML. 

Aby „dodać” plik JavaScript do swojej witryny, w head, używasz następującego kodu:


Upewnij się, że zdefiniowałeś type poprawnie, w przeciwnym razie Twoja witryna nie będzie ważna. Upewnij się również, że katalog /scripts istnieje w motywie i dodałeś do niego myscript.js.

Następnie możesz dodać dowolne odniesienie do funkcji używanych w pliku, który właśnie dodałeś do kodu HTML, w którym chcesz go użyć. 

Na przykład jest to przykład użycia właśnie dodanej funkcji.

" >Nagłówek idzie tutaj

4. Korzystanie z haka wp_head w celu dodania niestandardowego kodu JavaScript


Możesz także dodać niestandardowy kod JavaScript do swojego nagłówka za pomocą Wp_head hak akcji. Ponownie, to rozwiązanie nie jest preferowane, ponieważ generuje nadmierną liczbę skryptów. Tak jest, nigdyless, najlepiej ręcznie wstawiać skrypty do pliku header.php.

Ta metoda, której można również użyć w przypadku stopki, wykorzystuje zaczepy akcji do wstawiania skryptów wbudowanych do witryny. W przeciwieństwie do funkcji wp enqueue script, która umieszcza w kolejce niestandardowe skrypty, metoda wp head drukuje skrypty w szablonie nagłówka (i stopce, jeśli używasz Wp_footer hak).

Aby rozpocząć, przejdź do pliku functions.php i skopiuj i wklej następujący kod:

function collecter_custom_javascript() { ?>

<?php } add_action('wp_head', 'collective_custom_javascript');

Warto zauważyć, że wp head hook działa tylko na froncie Twojej witryny. Oznacza to, że żaden niestandardowy kod JavaScript dodany w ten sposób nie pojawi się w obszarze administracyjnym ani w obszarze logowania. Jeśli jednak chcesz dodać JavaScript do tych lokalizacji, możesz to zrobić za pomocą zaczepów akcji administratora head i login head.

Deweloperzy lubią funkcję skryptu wp enqueue, ponieważ pozwala uniknąć konfliktów, które mogą wystąpić w przypadku innych rozwiązań, takich jak bezpośrednie dodawanie skryptów do pliku header.php. Ponadto rozwiązanie to nie generuje żadnych skryptów zależnych.

Głównym problemem związanym z dodawaniem niestandardowego kodu JavaScript WordPress do nagłówka witryny jest to, że może on zakłócać działanie innych wtyczek, które ładują własne skrypty. Taka konfiguracja może również spowodować wielokrotne wczytywanie kilku skryptów, co może spowolnić ogólną szybkość i wydajność Twojej witryny.

Dodanie JavaScript do stopki WordPress jest stosunkowo proste. Możesz dodać kod do pliku nagłówka lub stopki, użyć niestandardowego elementu kodu w narzędziu do tworzenia stron lub motywie lub użyć określonej wtyczki nagłówka i stopki.

Dodaj JavaScript do stopki WordPress

Ponieważ powinieneś unikać dodawania kodu JavaScript do plików header.php lub footer.php, użyjemy wtyczki.

Polecam WPCode – Wstaw nagłówki i stopki + niestandardowe fragmenty kodu wtyczki.

Wybierz Ustawienia oraz Wstaw nagłówki i stopki menu.

Następnie wklej swój kod JavaScript w sekcji stopki na stronie.

Zapisz zmiany, gdy skończysz.

JESTEM H

Chcesz szybką stronę internetową?

Kogo ja oszukuję? Czyż nie wszyscy?

Dlaczego więc tak wielu z nas walczy?

Największym wyzwaniem jest zwykle znalezienie szybkiej, niezawodnej firmy hostingowej.

Wszyscy przechodziliśmy przez koszmary – wsparcie trwa wieczność lub nie rozwiązuje naszego problemu, zawsze obwiniając coś po swojej stronie… 

Ale największym problemem jest to, że witryna zawsze działa wolno.

At CollectiveRay hostujemy za pomocą hostingu InMotion, a nasza strona jest głupio szybka. Działamy na niestandardowym stosie konfiguracji serwera LightSpeed ​​na MariaDB z silnikiem PHP 7.4 i frontem przez Cloudflare. 

W połączeniu z naszymi optymalizacjami front-endu niezawodnie obsługujemy 6000 użytkowników każdego dnia, przy szczytowej liczbie 50+ jednoczesnych użytkowników. 

Chcesz uzyskać szybką konfigurację, taką jak nasza? Przenieś swoją witrynę za darmo na hosting InMotion i uzyskaj 50% ZNIŻKI na aktualne ceny.

Wypróbuj InMotion Hosting z 50% ZNIŻKĄ na CollectiveRay gości TYLKO w czerwcu 2024 r.!

Hosting InMotion 50% ZNIŻKI dla CollectiveRay odwiedzający

6. Dodawanie JavaScript do wideo WordPress

WordPress jest tak rozszerzalny, że umożliwia łatwe dodawanie nowych funkcji i funkcjonalności do witryny bez konieczności przeprojektowywania lub zastępowania całego motywu. Zamiast odtwarzać motyw WordPress od podstaw, możesz dodać funkcjonalność, po prostu dodając wtyczki.

A jeśli funkcjonalność, którą chciałbyś dodać, jest raczej niewielka i nie ma potrzeby tworzenia ani instalowania wtyczki, możesz użyć Plik functions.php lub na różne inne sposoby dodawania JavaScript do WordPressa bez konieczności tworzenia osobnej wtyczki.

Najlepsza rzecz w tym plik funkcji jest to, że działa jak wtyczka, której można używać do dodawania funkcji i rozszerzania funkcjonalności zarówno motywu, jak i samego WordPressa.

Chociaż możesz łatwo dodać Kod JavaScript bezpośrednio do twojego plik header.php, ale jest problem z tą metodą.

W rzeczywistości może powodować konflikty z innymi wtyczkami, gdy ładują własne skrypty JS.

W tym artykule autorstwa CollectiveRay, przyjrzymy się, w jaki sposób można dodać javascript do motywów WordPress. Jako programiści WordPressa jest to jedna z rzeczy, które będziemy musieli robić bardzo często.

(Specjalna notatka: Szukasz listy usprawnień/sztuczek, które możesz łatwo wprowadzić w swojej witrynie WordPress bez używania wtyczki? Możesz odnieść się do naszego przewodnika tutaj: 101 sztuczek WordPress, które każdy poważny bloger musi znać.)

7. Dodaj JavaScript do widżetu WordPress

Jeśli chcesz dodać trochę JavaScript do widżetu WordPress, nie może być łatwiej.

Dodaj widżet, wybierz menu i wybierz Edytuj jako HTML.

Dodaj swój JavaScript w ramach tags and select Aktualizacja.

Dodany kod powinien być natychmiast widoczny podczas przeglądania widżetu na interfejsie Twojej witryny.

Jak debugować błąd JavaScript na stronie WordPress

Debugowanie JavaScript jest procesem czasochłonnym, ale dla początkujących jest nieuniknione.

Na szczęście masz pod ręką narzędzia do sprawdzania błędów.

Otwórz stronę w przeglądarce i naciśnij klawisz F12 lub wybierz Narzędzia programistyczne z menu (Chrome). Możesz także użyć Ctrl + Shift + J (Windows/Linux) lub Cmd + Option + J (Mac).

Wybierz Konsola nowej części ekranu, która zostanie otwarta, a wszystkie błędy JavaScript zostaną podświetlone na czerwono.

Określ, skąd pochodzi błąd i popraw odpowiednią część dodanego kodu JavaScript.

Pracuj na swój sposób, aż wszystkie błędy zostaną rozwiązane.

WordPress ma własny tryb debugowania, ale może być nieco skomplikowany w użyciu. Polecam sprawdzić tzw oficjalna strona debugowania, aby uzyskać więcej informacji.

Często zadawane pytania dotyczące dodawania Javascript do WordPress

Co to jest JavaScript?

JavaScript to język komputerowy, który jest wykonywany w przeglądarce użytkownika, a nie na serwerze. Programowanie po stronie klienta umożliwia programistom osiągnięcie wielu interesujących rzeczy bez spowalniania witryny. Często możesz zostać poproszony o skopiowanie i wklejenie fragmentu kodu JavaScript do swojej witryny WordPress, jeśli chcesz osadzić odtwarzacz wideo, dodać kalkulatory lub inną usługę innej firmy.

Jak dodać plik JavaScript do WordPressa?

Najłatwiejszym sposobem dodania pliku JavaScript do WordPressa jest użycie wtyczki Insert WPCode. 

  • Zaloguj się do swojej witryny i zainstaluj wtyczkę WPCode.
  • Po zainstalowaniu kliknij Aktywuj
  • Zapisz kod JavaScript lub plik w nowym pliku za pomocą . Js rozbudowa.
  • Prześlij go do swojej witryny do następującego folderu: wp-content/themes/ /js/
  • Przejdź do Ustawienia> Wstaw WPCode
  • Dodaj następujące elementy do skryptów w nagłówku:  <script src="https://www.website.com/wp-content/themes/<theme-you-are-using>/js/file.js"></script>

Czy mogę używać Javascript w WordPressie?

Tak, istnieje wiele sposobów wykorzystania JavaScript w WordPressie. Jeśli chcesz dodać prosty skrypt, możesz użyć wtyczki Insert WPCode, aby dodać skrypt do nagłówka, a następnie wywołać skrypt z dowolnej części motywu, postu lub wtyczki, z której chcesz go użyć.

Jak dodać własny kod do WordPressa?

Najlepszym sposobem dodania własnego kodu do WordPressa jest użycie pliku functions.php. Zaleca się utworzenie motywu potomnego, a następnie dodanie własnych modyfikacji do motywu potomnego, aby nie zakłócać możliwości uaktualniania motywu.

Jak edytować JavaScript w WordPressie?

Najlepszym sposobem na edycję JavaScript w WordPressie jest utworzenie motywu potomnego, a następnie dodanie edycji kodu JavaScript lub dostosowanie innych funkcji w motywie potomnym. Pozwala to na edycję JavaScript w razie potrzeby bez uszkadzania reszty motywu lub możliwości aktualizacji motywu.

Wnioski

Powyższe trzy metody to najczystszy sposób na dodanie JavaScript do WordPressa. Ogólnie rzecz biorąc, bezpośrednie poprawianie kodu powinno być wykonywane przez zaawansowanych użytkowników, którzy mają duże doświadczenie w kodzie i mogą być pewni, że wiedzą, jak cofnąć wszelkie wprowadzone przez siebie zmiany. W przeciwnym razie najlepiej trzymać się wtyczek. Jeśli nie masz ochoty samodzielnie poprawiać kodu, byłoby wspaniale skontaktować się z naszymi partnerami na Fiverr, którzy mogą to zrobić na dziś

logo piątki

Kliknij tutaj, aby znaleźć tanich ekspertów od poprawek WordPress

O autorze
Dawid Attar
David pracuje w branży internetowej i cyfrowej od 21 lat. Ma ogromne doświadczenie w branży oprogramowania i projektowania stron internetowych, wykorzystując WordPress, Joomla i nisze je otaczające. Współpracował z agencjami rozwoju oprogramowania, międzynarodowymi firmami zajmującymi się oprogramowaniem, lokalnymi agencjami marketingowymi, a obecnie jest dyrektorem ds. operacji marketingowych w Aphex Media – agencji SEO. Jako konsultant cyfrowy koncentruje się na pomaganiu firmom w uzyskaniu przewagi konkurencyjnej dzięki połączeniu ich strony internetowej i dostępnych obecnie platform cyfrowych. Połączenie wiedzy technologicznej z dużym zmysłem biznesowym zapewnia jego pismom przewagę konkurencyjną.

Jeszcze jedna rzecz... Czy wiesz, że osoby, które udostępniają przydatne rzeczy, takie jak ten post, również wyglądają NIESAMOWITE? ;-)
Proszę zostaw użyteczny skomentuj swoje przemyślenia, a następnie udostępnij to na swoich grupach na Facebooku, które uznają to za przydatne i wspólnie zbierzmy korzyści. Dziękuję za udostępnienie i bycie miłym!

Ujawnienie: Ta strona może zawierać linki do zewnętrznych witryn produktów, które kochamy i gorąco polecamy. Jeśli kupisz sugerowane przez nas produkty, możemy otrzymać opłatę za polecenie. Takie opłaty nie wpływają na nasze rekomendacje i nie przyjmujemy płatności za pozytywne recenzje.

Autorzy promowani w:  Inc Czasopismo Logo .   Logo Sitepoint   Logo CSS Tricks    logo webdesignerdepot   Logo WPMU DEV   i wiele więcej ...