Подкючаем js в wordpress правильно

JS может быть инлайновым(inline) и внешним(external).

Если вы не в теме о вышесказанном, вот здесь можно ознакомиться http://javascript.ru/tutorial/foundation/start.

Мы будем подключать js в футер. Почему именно туда? Подключая js в футер мы имеем следующие преимущества

  • Все элементы DOM будут доступны для js, который загружается.
  • Не будет препятствовать загрузке DOM структуры
  • Если вы используете jquery. Вы можете смело опускать $(document).ready(function () {…}), т.к к моменту выполнения скриптов DOM будет полностью прогружен.

Еще один важный момент. Первыми подключим внешние скрипты, а затем инлайновые.
Найдем в нашей wp теме файлик functions.php и добавим функцию, которая поставит в очередь на добавление необходимые нам скрипты. Допустим нам необходимо подключить jquery.

В этой функции мы используем функции wordpressа.

wp_deregister_script(‘jquery’) — Отменяем регистрацию jquery. Вдруг кто-то до нас уже его уже регистрировал. Далее регистрируем свой с помощью функции wp_register_script(). Обратите внимание на последний аргумент функции — true. Он отвечает за добавление скриптов в футер. Информацию о остальных аргументах можно прочесть здесь http://wp-kama.ru/function/wp_register_script.

Далее нам напишем функцию печатающую инлайн скрипты

Наконец вешаем функции на события с помощью add_action

Готово. В результате хуки сработают и в футере выведутся подключения всех внешних скриптов, а затем инлайн кода. Успехов!

Результирующий код

 

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *