Как к wordpress подключить jquery?

как к wordpress подключить jqueryВсех приветствую. Писал я тут как-то о подключении библиотеки jquery, но тот способ годится только для статического сайта. А как к движку wordpress подключить jquery? Тут нужно действовать по-другому.

Дело в том, что если вы просто где-нибудь перед закрывающим тегом body напишете так:
подключение
То библиотека абсолютно никак не подключится просто потому, что адрес указан неверно. WordPress будет искать прописанный путь от корня сайта. А в корне у вас наверняка нет папки js. Тут есть 2 варианта решения проблемы:

  1. Прописать в атрибуте src абсолютный адрес, то есть http://... Но в этом случае подключение сработает только на текущем домене, при переносе шаблона в другое место все перестанет работать.
  2. Прописать относительный адрес от корня — wp-content/themes... В этом случае корректность подключения будет зависеть от названия и структуры шаблона — если ничего не менять, то все будет работать. Но опять же, лучше пойти более универсальным путем.

Оба способа в принципе подходят, но неправильны с точки зрения самого wordpress, ведь в движке заложены специальные функции, которые позволяют безопасно подключать скрипты и стили к шаблону, в том числе и jquery. Сейчас мы рассмотрим эти функции.

Подключаем jquery правильным образом

Для этого вам нужно соединиться с сайтом по ftp (как, смотрите тут), либо зайти из админки Внешний вид — Редактор. В общем, получить возможность редактирования кода.

Далее вам нужно найти functions.php, именно в него мы будем вставлять наш код для подключения библиотеки. Вот сам код, вставьте его в начало или конец файла:

function load_jquery (){
wp_enqueue_script ('jquery_me', get_template_directory_uri ().'/js/jquery-3.0.0.min.js');
}

Это код из шаблона одного из моих сайтов, вам, скорее всего, придется подредактировать его под себя. Тут мы пишем свою пользовательскую функцию, в которой вызываем функцию wp_enqueue_script. Она, в свою очередь, имеет 2 параметра: название (заполняем произвольно) и путь к файлу. Чтобы получить универсальный путь, используем функцию get_template_directory_uri() и соединяем ее со строкой, где прописывается путь уже исходя из корня шаблона.

Соответственно, вам нужно проверить, действительно ли в корневой папке вашего шаблона лежит каталог js, в котором есть файл jquery-3.0.0.min.js. Возможно, у вас каталог называется по-другому, другая версия jquery или просто она не сжатая и т.д. Во всех этих случаях вам нужно внести соответствующие правки в путь к файлу, чтобы у вас все подключилось правильным образом.

Отлично, саму функцию мы написали, остается вызывать ее при загрузке сайта, чтобы наша библиотека успешно подключилась. Для этого ниже добавьте такой код:
add_action('wp_enqueue_scripts', 'load_jquery');

Мы используем экшн или, как его еще называют — хук. Хук wp_enqueue_scripts подгружает к шаблону скрипты, а с помощью этой строчки кода мы даем движку команду — мол, выполни также при подгрузке функцию load_jquery. В этой самой функции движок выполняет подключение библиотеки.

Все, библиотека jquery успешно подключена к движку, в чем вы сможете убедиться, как только попробуете реализовать какой-нибудь скрипт с ее помощью. Если у вас все же остались вопросы, пишите в комментарии, а у меня на этом все!

Платное/бесплатное по WordPress на других сайтах

Бесплатные уроки по созданию шаблона на WordPress

Платный курс по созданию шаблонов Wordpress

Платный курс по созданию плагинов Wordpress

Шикарный платный плагин для оптимизации WordPress сайта

Премиум шаблон для WordPress, сделанный для людей

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