Функция, а точнее хук WordPress do_action('wp_head'), используется для заполнения тега <head>, а в него, как вы знаете, можно затолкать вот что:
Возникает следующий вопрос — для чего собственно нужна эта функция, если я допустим могу открыть файл темы и вставить туда всё, что захочу вручную? Да, возможно у вас и получится это сделать, а вот плагины не могут редактировать файлы темы и движка — как раз для них и нужны все эти хуки.
Функцию 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 ) ) ."" />nr"; } }
Удаление некоторых стандартных тегов из 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' );
Это не единственное место, где отображается версия движка. Если хотите полностью скрыть её, читайте этот пост.
(Пока оценок нет)
Загрузка...