Подключение JQuery в WordPress (правильный способ)
Я много раз писала про JQuery, в том числе и совместном его использовании в WordPress. Но о самом главном — о том как же все-таки правильно подключить его в шаблон, не разу не говорила, поскольку не придавала этому большого значения. И сегодня пришло время исправиться, и написать небольшую заметку об этом.
Если хотите, вы можете просто загрузить JQuery, положить на свой сервер и прописать ссылку на него в header.php, в секции <head>. Но это может причинить вам неудобства. Одна из причин — некоторые плагины использующие библиотеку JQuery, будут пытаться ее загрузить. Это может вызвать проблемы, поскольку плагину не будет известно, что она уже загружена.
Вторая причина в том, что Worpress уже включает в себя копию JQuery. Далее вы узнаете как можно загрузить JQuery в свою тему, правильным способом. Вставьте следующий код в файл header.php, в секции <head>:
<?php wp_enqueue_script("jquery"); ?>
<?php wp_head(); ?>
Ваша тема вероятно уже включает в себя функцию wp_head, так что убедитесь что вы расположили вызов функции wp_enqueue_script ДО функции wp_head. Теперь вы можете включить вызов своего собственного JQuery JavaScript-файла ПОСЛЕ функции wp_head.
<script type="text/javascript"
src="<?php bloginfo("template_url"); ?>/js/yourScript.js"></script>
(прим. автора Функция wp_enqueue_script(), как раз используется для безопасного подключения javascript в тему WordPress. Она может принимать следующие параметры:
<?php wp_enqueue_script( $handle, $src, $deps, $ver ); ?>
$handle
(строка) (обязательный) Название скрипта. Без регистра.
По умолчанию: Нет
$src
(строка) (необязательный) Путь к скрипту из корневой директории WordPress. Например: «/wp-includes/js/scriptaculous/scriptaculous.js«. Этот параметр необходим только когда WordPress ничего не знает об этом скрипте.
По умолчанию: Нет
$deps
(массив) (необязательный) Массив указателей на любые скрипты, от которых зависит этот скрипт; скрипты, которые должны быть загружены до этого скрипта. false — если зависимостей нет. Этот параметр необходим только в том случае, когда WordPress ничего не знает об этом скрипте.
По умолчанию: Нет
$ver
(строка) (необязательный) Строка указывает номер версии скрипта, если их несколько. По умолчанию значение false. Этот параметр используется для обеспечения отправки пользователю, правильной версии скрипта, независимо от кэша, и он обязательно должен быть включен, если доступен номер версии, и он влияет на работу скрипта.
По умолчанию: Нет).
В принципе вы уже можете действовать, но есть некоторые соображения. Например, избежать в будущем возможных конфликтов с другими библиотеками. Вы конечно не собираетесь сразу использовать несколько JS-библиотек, но лучше предусмотреть, чем потом сожалеть.
Чтобы максимально обезопасить себя от конфликтов, в можете перевести JQuery в «неконфликтный» режим и использовать другой шорткод. В нашем примере «$j» вместо дефолтного «$». Стандартный шорткод «$», например, может конфликтовать с Prototype. Далее пример безопасного использования JQuery:
var $j = jQuery.noConflict();
$j(function(){
$j("#sidebar li a").hover(function(){
$j(this).stop().animate({
paddingLeft: "20px&"
}, 400);
}, function() {
$j(this).stop().animate({
paddingLeft: 0
}, 400);
});
});
Можете ли вы узнать этот код? Мы использовали его для добавления анимации ссылок в сайдабре темы.
Интересная статья, но есть вопрос. Зачем у вас в блоге jQuery подключается 2 раза? Причем версии 1.2.6 и 1.3.2.
именно потому, что когда я делала свою тему, я еще мало что знала о правильном подключении jquery в WordPress, спасибо что сказали, надо будет исправить ;)
Большое Спасибо очень помогло
Спасибо! Долго мучался со скачанной темой WordPress, из-за конфликтов. Ваша статья помогла!!!
А лучше подключать jQuery из api google, там он gzip отдается + кэширование лучше.
Почему-то все ровно лезит 2 раза jquery… 1 раз от плагина Next Gen Gallery второй раз — то что я вставляю…
А если jquery требуется для плагина? И не известно подключена ли эта библиотека уже в теме или другим плагином.
Как правильно подключить jquery в плагине?
Оно то все хорошо, но вот wp_head() подключает свою версию js, и вызов
особо не не помогает, есть ли способ отключить jquery вообще? Странным образом скрипты не хотят работать, даже если их использовать после wp_head(), помогают лишь некоторые манипуляции с functions.php, в которых я не совсем уверен… в противном случае все плагины для jquery грузятся в коде до библиотеки.wp_head() не подключает ничего, скорее всего какой-то плагин вешает на фильр wp_head подключение jQuery, для того чтобы сама бибилиотека не грузилась дважды и нужн оиспользовать функцию wp_enqueue_script, только вот саму библиотеку не стоит так грузить, как на писано на этой странице. Если скрипт использует jQuery, то нужно с помощью функции загрузить пользовательский скрипт и указать в массиве 3 параметром, используемую библиотеку, т.е. jquery.
Установил Disqus, активировал его перестал работать nivo slider, в чем может быть беда?
Отключаю Дискус, слайдер опять работает.
Как выглядит проблема. У меня слайдер стоит на главной странице, после того, при автивированном дискусе, открывается сайт нормально, но слайдер вместо показа картинок, показывает крутящееся колесо, якобы что-то он пытается загрузить.
Просто не знаю даже куда обратиться, решил туда, где хоть немного речь идет о дискусе и джикверри.
Спасибо. Долго искал как подключить яваскрипт и нашел у вас ответ.
пжл помогите разобраться: поставил java калькулятор c jQuery-слайдером в тему WordPress, отладил — работает в опере, файрфоксе, гуглхроме, сафари, но в долбаном интернет эксплорере не отображается jQuery-слайдер — точнее рисунок отображается а ползунок не двигается. Библиотеки грузятся с ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js и ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js
Пробовал как тут рекомендовалось в header.php вставлять:
до и после полный путь
все равно в IE ползунок не двигается, что можно сделать? посоветуйте пжл
Доброго времени!
А если у меня в крде страницы есть такие строчки:
то это у меня java подключена или нет? очень хочется, чтоб была java и jquerry, но никак не могу разобраться, что надо делать ((
Ах ты ж.. не отобразилосью.. попробую так
script type=»text/javascript» src=»/wp-content/themes/redial/js/scripts.js» ></script