Przejdź do treści

Jak zaimportować plik z kodem JavaScript w WordPress-ie?

Tworzenie własnych motywów WordPress to nie tylko kod HTML czy CSS, ale również JavaScript.

Istnieje wiele sposobów na załadowanie pliku z kodem JavaScript. Kod JavaScript można umieścić w pliku PHP między znacznikami <script></script>, można również zaimportować plik z kodem umieszczając odpowiedni kod w sekcji <head></head>. Ale to nie są dobre sposoby na załadowanie kodu JavaScript na stronie z WordPress-em.

Jak zatem zaimportować plik z kodem JavaScript w WordPress-ie?

Najlepszym sposobem na zaimportowanie pliku z kodem JavaScript w WordPress-ie jest wywołanie funkcji w pliku functions.php.

Załóżmy, że plik z kodem JavaScript nosi nazwę javascript.js i jest umieszczony w katalogu motywu.

W pliku functions.php należy umieścić następujący fragment kodu:

add_action('wp_enqueue_scripts', function () {
    wp_enqueue_script('javascript', get_template_directory_uri().'/javascript.js');
});

Powyższy kod wywołuje akcję o nazwie wp_enqueue_scripts (jest ona wywoływana w chwili ładowania skryptów na stronie) i zawartości podanej jako drugi parametr (w naszym przypadku jest to funkcja anonimowa).

We wspomnianej funkcji anonimowej wywołujemy inną funkcję – wp_enqueue_script(). Jej pierwszy argument to unikalny, najlepiej jednowyrazowy opis pliku. Drugi argument to ścieżka do pliku, który chcemy zaimportować.