wp_head() — хук для подключения CSS, JS, jQuery и добавления мета-тегов

Функция, а точнее хук WordPress do_action('wp_head'), используется для заполнения тега <head>, а в него, как вы знаете, можно затолкать вот что:

  • CSS,
  • JavaScript (в том числе jQuery),
  • какой-нибудь HTML-код, например мета-теги;

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

Функцию wp_head() вы скорее всего найдёте в файле темы header.php, и она будет выглядеть следующим образом:

<?php wp_head() ?>

Сама по себе функция не имеет никаких параметров и ничего не возвращает.

Подключение CSS-стилей через wp_head()

Сразу хочу уточнить некоторые моменты относительно CSS — вы ведь знаете, что чем меньше общее количество подключенных на странице файлов стилей, тем меньше количество HTTP-запросов, а от них напрямую зависит скорость загрузки сайта. Так вот, перечисленные ниже способы подходят исключительно для написания плагинов, в остальных же случаях я рекомендую просто добавить ваши стили к основному файлу style.css, который находится в папке с текущей темой.

Способ 1. wp_enqueue_style()

Рассмотрим несложный пример. В нём мы подключим какой-нибудь произвольный файл стилей, находящийся в папке с темой, в поддиректории /css, где wp_head_style — что-то типо названия-идентификатора данного файла, можете назвать его как-нибудь по-своему.

И кстати, если вы не знаете, куда вставлять код из данного поста, то вставляйте в functions.php вашей текущей темы WordPress.

function css_to_wp_head() {
 	wp_enqueue_style( 'wp_head_style', get_stylesheet_directory_uri() . '/css/style-2.css', array(), null );
}
 
add_action( 'wp_enqueue_scripts', 'css_to_wp_head' );

Способ 2. Выводим стили непосредственно через HTML-тег <style>

По возможности советую использовать первый способ. Размещать стили непосредственно в HTML документе — не самая лучшая идея.

<?php
add_action("wp_head", "wp_head_css");
 
function wp_head_css() {
	?>
	<style>
		#widget_1{display:none;}
	</style>
	<?php
}

Аналогичным образом можно добавить и мета-теги, читайте подробнее чуть ниже.

Отключаем ненужные CSS из wp_head()

Некоторые плагины WordPress требуют для себя дополнительных стилей и поэтому подключают их к сайту указанным выше способом (как правило, это первый способ, т.е. через функцию wp_enqueue_style()).

Так вот, допустим какой-то вредный плагин наподключал вам на сайт всяких CSS, которые вам не нужны. Или допустим они вам всё-таки нужны, но вы хотите объединить их содержимое в один файл style.css (ну как вариант). Как следует поступать в таких случаях?

На самом деле делается это легко и просто: во-первых, нужно определить название-идентификатор подключаемого файла, как правило, это первый параметр функции wp_enqueue_style(). То есть мы обшариваем файлы плагина в поисках участков кода, где задействована эта функция и смотрим на её первый параметр.

Почему нельзя удалить найденный кусок кода прямо из плагина? Да потому что нам нельзя изменять содержимое файлов плагинов и движка — это не профессионально. К тому же такие тёмные дела обычно чреваты последствиями.

Итак, с идентификатором файла разобрались, что дальше? А дальше в ход идёт функция wp_dequeue_style(). В итоге в файл functions.php у нас идёт примерно следующий код:

function remove_css_from_wp_head() {
	wp_dequeue_style( 'тут_идентификатор_отключаемого_файла' );
}
 
add_action( 'wp_enqueue_scripts', 'remove_css_from_wp_head', 9999 ); // параметр 9999 можно опустить, это чтобы наверняка

Подключение JavaScript через wp_head()

Способ 1. wp_enqueue_script()

Всё примерно так же, как и со стилями. С одним единственным «НО», о котором следует помнить — скрипты лучше помещать в самый конец сайта, перед закрывающим тегом </body>. О том, как это сделать, вы можете почитать в документации к функции wp_enqueue_script().

function js_to_wp_head() {
 	wp_enqueue_script( 'wp_head_js', get_stylesheet_directory_uri() . '/js/script.js', array(), null );
}
 
add_action( 'wp_enqueue_scripts', 'js_to_wp_head' );

Способ 2. Выводим скрипты непосредственно через HTML-тег <script>

<?php
add_action("wp_head", "wp_head_js");
 
function wp_head_js() {
	?>
	<script>
		var totalWidth = 500;
	</script>
	<?php
}

jQuery в wp_head(). Конфликты.

Прежде чем читать этот пункт, хочу обратить ваше внимание, что очень часто то, из-за чего отказываются работать некоторые jQuery-эффекты — это несовместимость версий.

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

Подключение jQuery-версии по умолчанию

В WordPress уже зарегистрирован файл jQuery, он идёт вместе с движком (его версия меняется по ходу появления новых версий самого WordPress). Чтобы подключить стандартную версию файла, используем этот код:

function jquery_to_wp_head() {
 	wp_enqueue_script( 'jquery' );
}
 
add_action( 'wp_enqueue_scripts', 'jquery_to_wp_head' );

Изменение подключаемой версии jQuery

Так вот, предположим, что с появлением новой версии данной библиотеки, ваши скрипты перестали работать. Как же нам восстановить старую версию на сайте? Ну, как вариант, для начала вы можете скачать её и загрузить в папку с темой (можно подключать напрямую через googleapis, это не вопрос).

После этого нам помогут функции wp_deregister_script() и wp_register_script():

function jquery_another_version() {
	wp_deregister_script( 'jquery' );
	wp_register_script( 'jquery', get_stylesheet_directory_uri() . '/jquery-1.3.2.js', array(), '1.3.2' );
}
 
add_action( 'wp_enqueue_scripts', 'jquery_another_version' );

Переносим jQuery из wp_head() в wp_footer()

Вообще я сторонник того, чтобы все скрипты находились не в шапке сайта, а в футере, где-нибудь перед закрывающим тегом </body>. Конечно, если без JavaScript ваш сайт отображается ужасно или не отображается вообще, тогда целесообразнее задействовать скрипты прямо перед загрузкой страницы, во всех остальных случаях — пусть находятся в футере.

Итак, переносим jQuery и все зависимые от него скрипты в футер:

function jquery_in_footer() {
	wp_deregister_script( 'jquery' );
	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
}
 
add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );

Приоритет подключения js-файлов

Функции wp_enqueue_style(), wp_enqueue_script(), wp_register_style() и wp_register_script() также позволяют установить порядок подключения стилей и скриптов. В плане стилей это обычно не так важно, но в плане скриптов всё очень серьёзно. Например у нас есть файл jquery.js и какой-то плагин jquery.fancybox.js (к примеру). Ну так вот, jquery.fancybox.js должен обязательно подключаться после jquery.js, иначе ничерта работать не будет.

Как же установить приоритет? Легко — для этого нам понадобится третий параметр указанных выше функций. В данном параметре нам в виде массива нужно передать все названия-идентификаторы файлов, от которых зависит подключаемый файл. Рассмотрим на примере того же самого jquery.fancybox.js. Итак:

function jquery_fancybox() {
	wp_enqueue_script( 'fancybox', get_stylesheet_directory_uri() . '/jquery.fancybox.js', array('jquery') );
}
 
add_action( 'wp_enqueue_scripts', 'jquery_fancybox' );

Более подробно — в документации вышеуказанных функций (всё это есть на моём блоге — просто перейдите по соответствующим ссылкам).

Мета-теги в wp_head()

Вы можете использовать wp_head() для добавления собственных мета-тегов. В примере я вывел тег description, значение которого я взял из произвольного поля поста (а вы например можете взять в качестве его значения первое предложения поста или содержимое поля «Цитата»).

<?php
add_action("wp_head", "wp_head_meta_description", 1);
 
function wp_head_meta_description() {
	global $post;
	if( is_single() ) {
		echo "<meta name=\"description\" value=\"" . esc_attr( get_post_meta( $post->ID, 'seo_description', true ) ) ."\" />\n\r";
	}
}

Удаление некоторых стандартных тегов из wp_head()

RSD

Этот тег выглядит следующим образом <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://ваш-сайт.ru/xmlrpc.php?rsd" /> Если вы публикуете\редактируете свои посты только через админку и не используете для этих целей какие-либо сервисы или клиенты (например приложения для iPhone или iPad), то можете удалить этот тег:

remove_action( 'wp_head', 'rsd_link' );

wlwmanifest

Вот такой тег: <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://ваш-сайт.ru/wp-includes/wlwmanifest.xml" /> . Используется клиентом Windows Live Writer. Если не юзаете — удаляйте:

remove_action( 'wp_head', 'wlwmanifest_link' );

generator

Содержит текущую используемую версию WordPress: <meta name="generator" content="WordPress 3.5.1" />. Рекомендую к удалению.

remove_action( 'wp_head', 'wp_generator' );

Это не единственное место, где отображается версия движка. Если хотите полностью скрыть её, читайте этот пост.

Комментарии 55

  • Андрей10 ноября 2013 в 13:11 #

    Здравствуйте!
    Гугл, проанализировав мой сайт, выдал следующие критические замечания:

    Количество блокирующих скриптов на странице: 2. Количество блокирующих ресурсов CSS на странице: 3. Они замедляют отображение контента.
    Все содержание верхней части страницы отображается только после загрузки указанных далее ресурсов. Попробуйте отложить загрузку этих ресурсов, загружать их асинхронно или встроить их самые важные компоненты непосредственно в код HTML.
    Удалите код JavaScript, препятствующий отображению:
    http://сайт.ru/wp-includes/js/jquery/jquery.js?ver=1.10.2
    http://сайт.ru/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1
    Оптимизируйте работу CSS на следующих ресурсах:
    http://сайт.ru/wp-content/plugins/contact-form-7/includes/css/styles.css?ver=3.5.3
    http://сайт.ru/wp-content/plugins/wp-pagenavi/pagenavi-css.css?ver=2.70
    http://сайт.ru/wp-content/themes/modxblog/style.css
    Я так понял, что нужно убрать из хедера в футер эти скрипты и что-то c CSS.
    Использовал Ваши рекомендации по переносу jQuery в футер, вставил код в functions.php перед тегом ?>. Из хедера они изчезли, а в футере не появились.
    Что я сделал не так? Буду благодарен за помощь.

    • Миша10 ноября 2013 в 18:11 #

      Добрый вечер!

      По поводу CSS - просто объединяем всё в один файл, т.е. отключаем стили из плагинов WP-PageNavi и Contact-Form-7, а содержимое вставляем в общий style.css (перед тем, как отключать их указанным в данном уроке способом, рекомендую проверить настройки этих плагинов).

      По поводу jQuery - мне нужно взглянуть на тот код, который вы использовали, чтобы сказать в чем ошибка.

      • Андрей10 ноября 2013 в 19:11 #

        Использовал код из раздела "Переносим jQuery из wp_head() в wp_footer()" Вашей статьи. Может его нужно как-то изменить под мой шаблон? Я в веб-программировании не силён...

        • Миша10 ноября 2013 в 19:11 #

          ну обычно часто приходится немного подстраивать коды под себя, попробуйте такой вариант:

          function jquery_in_footer() {
          	wp_deregister_script( 'jquery' );
          	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
          	wp_enqueue_script( 'jquery' );
          }
           
          add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );
        • Миша10 ноября 2013 в 19:11 #

          чтобы дать вам более точные рекомендации, мне бы конечно лучше было бы взглянуть на ваш сайт сначала.

  • Андрей10 ноября 2013 в 20:11 #

    Попробовал этот вариант. Результат тот же: из хедера уходят, но в футере не появляются...

  • Андрей11 ноября 2013 в 08:11 #

    Всё разобрался! Подключил её перед тегом и все скрипты переместились в футер. Будем ждать, что скажет Гугл.
    Миша, Вам огромное спасибо!
    И ещё вопрос про CSS: правильно ли я понял, что нужно скопировать содержимое файлов и вставить это в файл CSS темы и прописать код с идентификатором (в моём случае это два кода) в function.php?
    А потом ещё взять и оптимизировать CSS каким-либо оптимизатором (только каким?)

    • Миша11 ноября 2013 в 09:11 #

      1. да, правильно, копируем все CSS в один главный файл темы и отключаем их либо через настройки плагина, либо через functions.php

      2. могу посоветовать свой оптимизатор, он довольно удобен и позволяет оптимизировать CSS так, чтобы потом можно было их хоть как-то редактировать, но можно применить и жесткую оптимизацию. http://rudrastyh.com/css-minifier. Он правда на английском, но в принципе там всё интуитивно понятно, если будут вопросы - обращайтесь :)

    • Александр18 марта 2015 в 20:03 #

      Отличный компрессор CSS http://tools.arantius.com/css-compressor

  • Vfrcbv10 февраля 2014 в 21:02 #

    Михаил спасибо за информацию но:
    я честно говоря не совсем понял куда, что прописывать))
    Правильно ли я все делаю?

    1. Открыл в своей теме function.php
    2. Вставил вот этот код:

    function jquery_in_footer() {
    	wp_deregister_script( 'jquery' );
    	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
    	wp_enqueue_script( 'jquery' );
    }
     
    add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );

    3. Открыл footer.php там вконце нашел такую строчку

    4. Page speed пишет всеравно
    Remove render-blocking JavaScript:
    http://сайт.ru/wp-includes/js/jquery/jquery.js
    http://сайт.ru/…es/medico/js/foundation.min.js?ver=3.7.1
    http://сайт.ru/…y.carouFredSel-6.2.0-packed.js?ver=3.0.1

    Чего делать?

  • Максим10 февраля 2014 в 23:02 #

    Как убрать два последних скрипта?

  • Макс19 февраля 2014 в 01:02 #

    Foundation.js и carufedsel.js
    Я так понимаю, что если jquery.js убрать в футер, то сайт нормально не будет отображаться?

  • Дима12 июля 2014 в 12:07 #

    Спасибо, Михаил! Про порядок подключения скриптов понятно. А как "заставить" их загружаться асинхронно? Блог пролистал, но такой темы не нашел.

  • Женя23 августа 2014 в 12:08 #

    Здравствуйте, Михаил есть ли какой-нибудь способ контролировать порядок вывода кода функцией wp_head(); т.е мне не нравится что у меня идет тайтл, потом идет куча кода выводимого wp_head, а потом где то внизу идет дескрипшн и кейвордц, так же выводимые функцией wp_head (у меня это делает плагин ALL in SEO pack)

  • Женя23 августа 2014 в 13:08 #

    Разобрался,
    Приоритет вывода задается при подключении hook'ов. По умолчанию приоритет равен 10. Чем число меньше, тем раньше будет осуществлён вывод.

    Например, если взять плагин All in One SEO, который выводит мета-теги описания и ключей (по аналогии с примером serkaz), то чтобы вывести их раньше остальных, достаточно будет установить больший приоритет.

    В файле plugins/all-in-one-seo-pack/all_in_one_seo_pack.php находим строку:

    add_action( 'wp_head', array( $aiosp, 'wp_head'));

    и третим параметром передаём ей приоритет:

    add_action( 'wp_head', array( $aiosp, 'wp_head'), 1);

    В результате получаем желаемый вывод:

  • VRS24 августа 2014 в 08:08 #

    Привет, Миш.
    Можете ли ты подсказать как отключить вывод скриптов, если они выводятся так:
    // This plugin uses jQuery extensively
    if (NGG_FIX_JQUERY) {
    add_action('wp_enqueue_scripts', array(&$this, 'fix_jquery'));
    add_action('wp_print_scripts', array(&$this, 'fix_jquery'));
    }

    Обновила версию NextGEN Gallery, а оказалось, что она принудительно грузит встроенное в ВП jquery, которое блокирует мое слайд шоу на главной. Хочу через add_action('template_redirect', 'remove_plugins'); отключить на главной загрузку скриптов, но по найденному рецепту не получается.

    • Миша24 августа 2014 в 09:08 #

      Привет!
      Да, сталкивался с такой проблемой, уже не помню, как точно её решил (либо просто закомментил строку в файле плагина, либо как-то через хук).

      Скажу лишь, что тут надо копать в сторону wp_print_scripts.

  • goroboy29 октября 2014 в 08:10 #

    отлисный сайт и отличная статья. Здесь можно много найти про оптимизацию сайта. Спасибо тебе Миша!!!

  • Владимир5 января 2015 в 12:01 #

    Добрый день, Михаил, спасибо за совет. Перенес скрипты в футер, стало все работать нормально, PageSpeed хвалит :). Но через некоторое время опять стал ругаться PageSpeed - перенесите скрипты в футер. При том, что скрипты в исходном коде и так футере. Не могу понять чем дело. Подскажите. Сайт web-mechanic.ru

    • Миша6 января 2015 в 09:01 #

      Добрый день!
      Ну jQuery тоже в футер отправьте :)

      • Владимир6 января 2015 в 11:01 #

        я отправил - добавил в function.php такой код

        function jquery_in_footer() {
        	wp_deregister_script( 'jquery' );
        	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
        	wp_enqueue_script( 'jquery' );
        }
         
        add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );
  • Владимир7 января 2015 в 11:01 #

    а как сделать, подскажите с кодом

  • Андрей18 февраля 2015 в 16:02 #

    Привет, а как подключить ко всем файлам js в шапке асинхронность async ? а именно для jquery и admin-bar

    • Миша19 февраля 2015 в 08:02 #

      Привет!
      Если подключение идёт через wp_enqueue_script(), то есть вот такой вариант:

      function true_script_async( $src ) {
      	if (strpos($src, '#loadasync')===false) // в конце URL скриптов, для которых нужно сделать асинхронную загрузку добавляем хэштег, например #loadasync
      		return $src; // если хэштег отсутствует, ничего не меняем
      	else if (is_admin())
      		return str_replace('#loadasync', '', $src); // если админка - просто удаляем хэштег
      	else
      		return str_replace('#loadasync', '', $src) . "' async='async";  // асинхронная загрузка
      }
      add_filter('clean_url', 'true_script_async', 11, 1);
  • Сергей26 февраля 2015 в 17:02 #

    Вот блин незадача. Проковырялся целый день, но то ли я тупой, то ли где-то в теме огромная собака.
    сайт crimea-extrim.ru
    Не удается перенести в футер скрипты MenuMatic_0.68.3.js, jquery.min.js, banner.js
    Действовал по схеме "Переносим jQuery из wp_head() в wp_footer()"
    jQuery из хедера пропали, в футере не появились.
    MenuMatic_0.68.3.js, jquery.min.js, banner.js даже пропадать не хотят.
    PageSpeed Insights матерится "Удалите код JavaScript, препятствующий отображению"
    Перечень кодов:

    http://crimea-extrim.ru/…emes/NatureBlog/menu/MenuMatic_0.68.3.js
    http://crimea-extrim.ru/…-includes/js/jquery/jquery.js?ver=1.11.1
    http://crimea-extrim.ru/…s/jquery/jquery-migrate.min.js?ver=1.2.1
    http://vk.com/js/api/openapi.js?115
    https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
    http://crimea-extrim.ru/wp-content/banner/banner.js

    В футере

    <?php wp_footer();
    	echo get_theme_option("footer")  . "\n";
    ?>

    Подскажите пожалуйста, как победить.

  • Сергей26 февраля 2015 в 17:02 #

    В function писал так:

    function MenuMatic_in_footer() {
     
    	wp_deregister_script( 'MenuMatic' );
     
    	wp_register_script( 'MenuMatic', get_stylesheet_directory_uri() . '/menu/MenuMatic_0.68.3.js', array(), '', true );
     
    }
     
    add_action( 'wp_enqueue_scripts', 'MenuMatic_in_footer' );
     
     
     
    function jquery_in_footer() {
     
    	wp_deregister_script( 'jquery' );
     
    	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), '', true );
     
    }
     
    add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );
     
     
    function jquerymin_in_footer() {
    	wp_deregister_script( 'jquerymin' );
    	wp_register_script( 'jquerymin', 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js', array(), null, true );
    }
     
    add_action( 'wp_enqueue_scripts', 'jquerymin_in_footer' );
     
     
    function banner_in_footer() {
     
    	wp_deregister_script( 'banner' );
     
    	wp_register_script( 'banner', content_url('/banner/banner.js'), array(), '', true );
     
    }
     
    add_action( 'wp_enqueue_scripts', 'banner_in_footer' );
    • Миша27 февраля 2015 в 10:02 #

      Ну для начала замените все функции wp_register_script на wp_enqueue_script.

      Просто замените, ничего больше не меняя, в том числе параметры.

      • Сергей28 февраля 2015 в 09:02 #

        После замены выдает 502 ошибку

      • Сергей28 февраля 2015 в 13:02 #

        Скрипты перенеслись в футер, но и в хедере остались.

        • Миша1 марта 2015 в 09:03 #

          Попробуйте также wp_dequeue_script или установить приоритет фильтра повыше.

          • Сергей1 марта 2015 в 15:03 #

            А куда wp_dequeue_script вставлять? Перед чем-то или вместо чего-то?
            Вставлял перед wp_deregister_script( 'banner' ); - никаких изменений, вместо нее - то же самое.
            А с приоритетом что-то не совсем понял.
            Нужно поменять местами в function подключение скриптов, или поставить в зависимость от чего-то (чего?).

  • Сергей8 марта 2015 в 15:03 #

    Добрый день, Михаил.
    после проверки в PageSpeed Insights
    Удалите код JavaScript, препятствующий отображению:
    http://сайт/…-includes/js/jquery/jquery.js?ver=1.11.1
    http://сайт/…s/jquery/jquery-migrate.min.js?ver=1.2.1
    http://сайт/…nt/themes/enfold/js/avia-compat.js?ver=2
    http://сайт/…Slider/static/js/greensock.js?ver=1.11.8
    http://сайт/…slider.kreaturamedia.jquery.js?ver=5.3.2
    http://сайт/…/js/layerslider.transitions.js?ver=5.3.2
    http://сайт/…p-content/themes/enfold/js/avia.js?ver=3
    http://сайт/…ent/themes/enfold/js/shortcodes.js?ver=3
    http://сайт/…popup/jquery.magnific-popup.min.js?ver=2
    http://сайт/…ediaelement-and-player.min.js?ver=2.15.1
    http://сайт/…ediaelement/wp-mediaelement.js?ver=4.1.1
    http://сайт/…cludes/js/comment-reply.min.js?ver=4.1.1

    Не совсем получается перенести скрипты в footer.
    В function в исходном варианте так:

    //register js
    		wp_enqueue_script( 'avia-compat', $template_url.'/js/avia-compat.js', array('jquery'), 2, false ); //needs to be loaded at the top to prevent bugs
    		wp_enqueue_script( 'avia-default', $template_url.'/js/avia.js', array('jquery'), 3, true );
    		wp_enqueue_script( 'avia-shortcodes', $template_url.'/js/shortcodes.js', array('jquery'), 3, true );
    		wp_enqueue_script( 'avia-popup',  $template_url.'/js/aviapopup/jquery.magnific-popup.min.js', array('jquery'), 2, true);
     
    		wp_enqueue_script( 'jquery' );		
    		wp_enqueue_script( 'wp-mediaelement' );
    		if ( is_singular() && get_option( 'thread_comments' ) ) { wp_enqueue_script( 'comment-reply' ); }

    Сразу после

     wp_enqueue_script( 'jquery' );

    добавляю

    function jquery_in_footer() {
    	wp_deregister_script( 'jquery' );
    	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
    	wp_enqueue_script( 'jquery' );
    }
     
    add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );

    Но ничего не происходит. Скрипт как был в хедере, так там и остался и в футере не появился.
    Прошу помочь с данным вопросом. В php не силен

    • Миша9 марта 2015 в 08:03 #

      Добрый день!
      1) проверьте файл header.php — он может просто-напросто находиться там.
      2) не понятно, в первом листинге вы задействуете фильтр wp_enqueue_scripts или нет.

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

  • Artem2 апреля 2015 в 20:04 #

    Здравствуйте, помогите разобраться, прописал в файл функции код

    function jquery_in_footer() {
    	wp_deregister_script( 'jquery' );
    	wp_register_script( 'jquery', includes_url('/js/jquery/jquery.js'), array(), null, true );
    	wp_enqueue_script( 'jquery' );
    }
     
    add_action( 'wp_enqueue_scripts', 'jquery_in_footer' );

    в результате из хидера убрались строчки

    <script type='text/javascript' src='http://shkolnye-prezentacii.ru/wp-includes/js/jquery/jquery.js?ver=1.11.1'></script>
    <script type='text/javascript' src='http://shkolnye-prezentacii.ru/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>

    Но вместо них появилась строчка

    <script type='text/javascript' src='http://shkolnye-prezentacii.ru/wp-includes/js/jquery/jquery.js'></script>

    А ссылки в футере так и не появились. В чем может быть проблема?
    мой сайт

    http://shkolnye-prezentacii.ru/
    • Миша3 апреля 2015 в 08:04 #

      Здравствуйте!
      Тут, чтобы точно сказать, нужно смотреть код и тестить, сходу могу только посоветовать попробовать отключить fancybox и посмотреть, изменится ли что-то.

      • Artem3 апреля 2015 в 08:04 #

        Понятно, к сожалению отключение плагина не дало результат. Я пробовал отключить почти все плагины, но все осталось как и было

        • Миша3 апреля 2015 в 08:04 #

          Если хотите, можете выслать мне ftp по email или в форме обратной связи, я гляну.

          • Artem3 апреля 2015 в 10:04 #

            Спасибо за предложение помощи, но пока буду пробовать своими силами.

            Вот на одном сайте нашел (перевод) : Обратите внимание: если сценарий загружается с помощью wp_enqeue_script (), в котором перечислены JQuery как зависимость и $ in_footer значение ЛОЖЬ, WordPress будет разместить JQuery в голову вместо нижнего колонтитула, независимо от значения in_footer $ для JQuery.

            Думаю у меня эта ситуация, но как ее исправить?

  • mypsyblog19 мая 2015 в 01:05 #

    Здравствуйте, у меня проблема решилась этим кодом

    <?php
    /**
     * Load Enqueued Scripts in the Footer
     *
     * Automatically move JavaScript code to page footer, speeding up page loading time.
     */
    function footer_enqueue_scripts() {
       remove_action('wp_head', 'wp_print_scripts');
        remove_action('wp_head', 'wp_print_head_scripts', 9);
        remove_action('wp_head', 'wp_enqueue_scripts', 0);
        add_action('wp_footer', 'wp_print_scripts', 5);
        add_action('wp_footer', 'wp_enqueue_scripts', 5);
        add_action('wp_footer', 'wp_print_head_scripts', 5);
    }
    add_action('after_setup_theme', 'footer_enqueue_scripts');
    ?>

    Скрипты плагинов теперь в подвале
    вот сайт

    http://mypsyblog.ru/
    • mypsyblog19 мая 2015 в 03:05 #

      Вот еще вариант

      <?php
      function move_js_to_footer() {
      	remove_action('wp_head', 'wp_print_scripts');
      	remove_action('wp_head', 'wp_print_head_scripts', 9);
      	remove_action('wp_head', 'wp_enqueue_scripts', 1);
      }
      add_action('wp_enqueue_scripts', 'move_js_to_footer');
      ?>
  • Артур22 июня 2015 в 15:06 #

    Можно пополнить статью удалением emoji. )

    remove_action('wp_head', 'print_emoji_detection_script', 7);
    remove_action('wp_print_styles', 'print_emoji_styles');

  • Евгений20 января 2016 в 16:01 #

    Отличный блог, нашел функцию, которая перенесла мои js файлы из header в footer. Остались только ошибки с css, счас почитаю как объединить все css файлы в один . Сайт в закладки поместил.

Оставить комментарий / вопрос

phpjsHTMLCSSSQLПросто код
  Для того, чтобы оставить комментарий, пожалуйста, зарегистрируйтесь или авторизуйтесь на сайте.
  • Миша: Привет ещё раз, не поверишь, реально не сталкивался с этим вопросом. По теории можно сказать следующее: во-первых,...

  • Миша: Привет, вообще без проблем, делаешь всё через require(), require_once() - выбирай любую, какая больше нравится.

  • Виталий Моргунов: Привет! Не могу разобаться, как я могу контролировать порядок подключения стилей. В моем случае мне нужно чтобы стили...

  • Миша: Спасибо!

  • w0rmak: Это было просто. Нашел код в интернете. Добавьте и себе ymaps.load(function () { var input = document.getElem...