Авг

Оптимизируем WordPress header и удаляем лишний код

Если вы интересовались вопросом оптимизации wordpress кода, то наверняка сталкивались с разными советами по редактированию файла header.php. В нем генерируются значения блока HEAD для веб-страниц сайта. Самые простые рекомендации заключались в замене вызова стандартных функций, например, bloginfo(‘charset’) на конкретные значения charset=UTF-8. Однако позже оказалось, что выигрыш производительности в ходе данных действий по сравнению с тем же Lazy Load плагинами не так уж велик. Дело в том, что все основные значения в HEAD WordPress считывает из базы всего за одно обращение к ней. Сегодняшние подсказки по улучшению вордпресс header будут куда более полезными и эффективными.

Давайте внимательно посмотрим на исходный код в HEAD обычной страницы/поста. И параллельно сравним его с файлом header.php в WordPress шаблоне. Очевидно, что кроме парочки параметров, вызова Javascript скриптов и CSS результирующий HTML содержит много других дополнительных строк. Они автоматически генерируются в процессе использования разных плагинов на вашем сайте. Иногда финальный код получается ну очень большим.

Безусловно, многие из этих функций жизненно необходимы для корректной работы модулей, однако есть и такие, от которых можно избавиться. Самый простой пример — использование библиотеки jQuery. Некоторые плагины, как и сама система, вставляют код ее вызова в wordpress header. Как следствие, у вас может подгрузиться несколько дублирующих скриптов, еще и не с самой актуальной версией.

Второй пример хорошо просматривается для плагина WP-PageNavi (разбиение блога на страницы). В ходе работы модуль размещает свой CSS в шапку сайта, хотя более эффективно будет перенести все стили в базовый style.css. Причем избавиться от кода модуля так просто не получится, поможет лишь его деактивация (что разумеется, не вариант). Возможно, после версии 2.5.0 создатели внесли некоторые изменения в код, но раньше все работало именно так.

Базовая оптимизация wordpress header

Большинство «дополнительных вставок» блока HEAD реализуется системой с помощью хуков для wp_head. Если посмотрите код файла header.php в wordpress шаблоне, то наверняка найдете ее там. Просто убрать вызов функции не получится, так как в результате удалятся не только «ненужные вставки», но и важный код, без которого сайт работать не будет.

К счастью, вы можете безболезненно деактивировать некоторые последствия вызова wp_head. Избавиться от лишних элементов, которые не планируете использовать, и провести оптимизацию wordpress кода можно с помощью хаков для functions.php. Открываете файл функций и пишите туда следующий код:

remove_action('wp_head','feed_links_extra', 3); // убирает ссылки на rss категорий
remove_action('wp_head','feed_links', 2); // минус ссылки на основной rss и комментарии
remove_action('wp_head','rsd_link');  // сервис Really Simple Discovery
remove_action('wp_head','wlwmanifest_link'); // Windows Live Writer
remove_action('wp_head','wp_generator');  // скрыть версию wordpress

Также можно скрыть разные линки при отображении постов блога (следующий, предыдущий, короткий url).

remove_action('wp_head','start_post_rel_link',10,0);
remove_action('wp_head','index_rel_link');
remove_action('wp_head','adjacent_posts_rel_link_wp_head', 10, 0 );
remove_action('wp_head','wp_shortlink_wp_head', 10, 0 );

Удаление JSON API ссылок:

remove_action( 'wp_head', 'rest_output_link_wp_head');
remove_action( 'wp_head', 'wp_oembed_add_discovery_links');
remove_action( 'template_redirect', 'rest_output_link_header', 11, 0 );

Как я уже говорил выше про jQuery, в коде страницы библиотека может вызываться несколько раз (совместно с другими модулями) + версия используется не самая актуальная. Убрать скрипт из вордпресс header через remove_action не получится, но есть другой метод. В блоге найдете подробную статью про обновление и подключение jQuery в WordPress, а если говорить вкратце, то чтобы убрать вызов скрипта нужен такой код:

if ( !is_admin() ) { 
	wp_deregister_script('jquery'); 
}

В данном случае хак срабатывает только для самого сайта (фронтэнда), не влияя на админку. Если вызывать функцию wp_deregister_script без условия IF, то в панели управления WP перестанут работать разные выпадающие меню и некоторые другие опции. Теоретически, можно было бы поместить код wp_deregister_script в header.php вместо functions.php, и тогда он «не заденет» бэкэнд. Но лучше использовать вараинт, указанный выше.

Напоследок еще 2 фишки. Недавно я публиковал статью про выключение Emoji. Короткую версию кода найдете ниже, хотя лично у меня сработала только расширенная, описанная в посте.

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

Также в блоге публиковал обзор модуля Disable позволяющего убрать Self Pingback и некоторые другие данные из в wp head в wordpress. Можно совмещать его с хаками через functions.php — так надежнее, плагин отключает не все.

Убираем лишний код плагинов и темы

Кроме самой системы код в блок HEAD добавляют разные модули. Иногда отключение данной фишки находится в настройках плагинов, но к сожалению, чаще всего разработчики не предусматривают подобную гибкость для своих решений. Поэтому дабы изменить wordpress header можно попробовать некий алгоритм.

Во-первых, вы должны внимательно посмотреть основной php файл того плагина, хуки которого собираетесь деактивировать. Там должна встречаться конструкция по типу:

add_action('wp_head', 'plugin_function_here');

Нашли? — хорошо. Теперь дабы избавиться от вызова функции добавляем в файл functions.php следующую строку:

remove_action('wp_head', 'plugin_function_here');

Сохраняете и смотрите что получилось. Ниже собрал несколько примеров хаков для разных модулей. Возможно, кое-что пригодится.

WP-Syntax

Фукция ниже позволяет убрать подключение стилей для подсветки синтаксиса программного кода в тексте. Само содержимое файла wp-syntax.css небольшое, поэтому можно просто добавить в стандартный style.css.

remove_action( 'wp_head','wp_syntax_head');

qTranslate-X

Модуль добавляет в wordpress header информацию о версии, которую можно скрыть.

remove_action('wp_head','qtranxf_wp_head_meta_generator');

Contact Form 7

Для Contact Form 7 решение чуть более сложное. Логично, что вызов плагина не нужен на страницах, где этой самой формы нет. Он лишь создает дополнительную нагрузку. Исправляем ситуацию и проведем оптимизацию wordpress кода с помощью следующих строк:

// Deregister Contact Form 7 styles
 
add_action( 'wp_print_styles', 'aa_deregister_styles', 100 );
function aa_deregister_styles() {
    if ( ! is_page( get_theme_mod( "header_contacts") ) ) {
        wp_deregister_style( 'contact-form-7' );
    }
}
 
// Deregister Contact Form 7 JavaScript files on all pages without a form
add_action( 'wp_print_scripts', 'aa_deregister_javascript', 100 );
function aa_deregister_javascript() {
    if ( ! is_page( get_theme_mod( "header_contacts") ) ) {
        wp_deregister_script( 'contact-form-7' );
    }
}

WP-PageNavi

Бывают уникальные случаи, когда использование remove_action для wp_head не срабатывает. Так, например, с тем же WP-PageNavi (версии 2.5.0), где нет явного вызова функций в wp_head, но плагин все равно грузит свой файл стилей. Если внимательно рассмотреть исходный код wp-pagenavi.php, то найдете там некую функцию «Enqueue PageNavi Stylesheets», которая добавляет стили через add_action. Соответственно чтобы прекратить этот вызов размещаем в файле функций fuctions.php строку:

remove_action('wp_print_styles', 'pagenavi_stylesheets');

Yet Another Related Posts Plugin

Стили плагина похожих постов YARPP можно включить в style.css, убрав загрузку нескольких лишних файлов. Хак избавляется от кода модуля в header и footer: ликвидируются файлы стилей widget.css, related.css и yarpp-thumbnails-yarpp-thumbnail.

add_action( 'wp_print_styles', 'tj_deregister_yarpp_header_styles' );
function tj_deregister_yarpp_header_styles() {
   wp_dequeue_style('yarppWidgetCss');
   // Следующая строка нужна, если related.css грузится в header, а в футере отключен
   wp_deregister_style('yarppRelatedCss'); 
}
 
add_action( 'wp_footer', 'tj_deregister_yarpp_footer_styles' );
function tj_deregister_yarpp_footer_styles() {
   wp_dequeue_style('yarppRelatedCss');
   wp_dequeue_style('yarpp-thumbnails-yarpp-thumbnail');
}

Для шаблонов/тем

Если вам нужно убрать лишние стили или скрипты из темы, то можете воспользоваться функциями wp_dequeue_style и wp_deregister_script. Ниже привожу пример кода, который мне помог решить соответствующую задачу. Названия скриптов нашел в итоговом HTML и разных файлах шаблона.

add_action( 'wp_enqueue_scripts', 'remove_some_stylesheet', 20 );
function remove_some_stylesheet() {
    wp_dequeue_style('flexslider');
    wp_dequeue_style('owl-carousel');
    wp_dequeue_style('owl-theme');
    wp_dequeue_style('font-awesome');
    wp_dequeue_style('wp-pagenavi');
 
    wp_deregister_script('flexslider');
    wp_deregister_script('googlemapapis');
    wp_deregister_script('easing');
    wp_deregister_script('jflickrfeed');
    wp_deregister_script('playlist');
    wp_deregister_script('jplayer');
}

В общем, вы должны были заметить некий глобальный принцип работы с «ненужными вызовами» для wp_head — находите соответствующую функцию плагина/темы, а затем ее отключаете. С помощью разных хаков в fuctions.php сможете изменить вордпресс header дабы: 1) избавиться от лишней функциональности; 2) убрать дублирующие строки и оптимизировать код wordpress сайта. Если вы знаете еще какие-то дополнительные хаки или у вас имеются замечания по текущим, пишите в комментариях.

Оцените статью:

(голосов - 43, средний балл: 5,19 из 7)

Загрузка...

Категории: Оптимизация; Хаки и секреты;

Теги: оптимизация блога, оптимизация кода, правка плагинов, правка шаблона, улучшаем блог, ускорение блога.

комментария 72 к статье “Оптимизируем WordPress header и удаляем лишний код”

← Ранее 1 2 3 Далее →

Vlad 10.07.2013
В общем нашел решение, в файле functions.php надо добавить строку
add_filter(‘show_admin_bar’,’__return_false’);

Проблему с margin-top решает, как с остальным будем смотреть:)
Mars 07.11.2013
Здравствуйте!
До лишних элементов в header тоже надо добраться, но пока встала такая проблема, и я не могу найти ответ. Может, подскажете?
После некоторой реорганизации сайта пришлось удалить некоторые страницы из индекса, но через 180 дней ошибка вновь вернулась.
Как правильно прописать в robots.txt?
Disallow: /page.html # закрывает страницу page.html
Disallow: / http://happylady.su/puteshestviya/
Или
Disallow: / happylady.su/puteshestviya/
Или
Disallow: / puteshestviya/
Или варианты из вышеперечисленного без / в конце?
Как бы с водой ребенка не выплеснуть, не удалить весь сайт из индекса.
Заранее благодарю за ответ.
Tod 07.11.2013
Mars, могу посоветовать вам добавить сайт в Яндекс.Вебмастер и там есть опция проверки файла robots.txt — вы указываете страницы сайта и смотрите запрещает их роботс или нет. Если по существу, то (насколько я знаю)
Disallow: /page.html — запрещает все ссылки что заканчиваются на «/page.html», то есть first/page.html, second/page.html и т.п.
Disallow: / http://happylady.su/puteshestviya/ — неправильный синтаксис, лишняя «/»
Disallow: / happylady.su/puteshestviya/ — та же история
Disallow: / puteshestviya/ — если писать без пробела «/puteshestviya/» то запрещаются все пути, содержащие в себе puteshestviya (я так понимаю запрещаете раздел». Можно попробовать без последнего «/».
Mars 07.11.2013
но google webmasters прямо так и прописывает ошибку: puteshestviya/

Ладно, в любом случае, спасибо за ответ.
Tod 07.11.2013
В смысле Disallow: /puteshestviya — выдает ошибку?
Эдик 06.05.2014
Все делал как сказано в статье, но как только вставил указанный здесь код. Получил ответ, что нет закодированных ссылок. Я их убирал в функшене. if ( strpos($c, $l) == 0 заменил ноль на 1 и удалил ссылки. Подскажите, что еще нужно поменять, иначе код становиться не хочет, сайт не работает.
Tod 07.05.2014
Эдик, к сожалению, давно занимался этим и уже мало что помню. Нужно тестировать и пробовать, в разных шаблонах свои какие-то конструкции и не всегда все применимо, если просто скопировать.
mayklvipp 18.06.2014
Спасибо за статью, но у меня настолько «тяжёлый шаблон» + много плагинов что пришлось подключить персональный веб сервер. Совсем не дорого, за 150 рублей в месяц весь комплект. хостинг с 2 Гб 2 сайта+ веб сервер
Галина Шевалер 17.07.2014
Обалдеть!

Сколько не пишу — посещаемость не растет…

И вот что нашла — у меня будлируются мета-тэги и тайтл в статьях.

Грешу на All in One Seo Pack

НО совсем не знаю как решить проблему????
Tod 17.07.2014
Галина, посещаемость напрямую не зависит от количества написанного текста. Обычно это происходит за счет того что новые статьи появляются в поисковиках по новым запросам, а также некоторые читатели становятся постоянными. Однако для планомерного повышения посещаемости нужно продвижение.
Что касается плагина All in One Seo Pack, то он позволяет для каждой статьи указать свой оригинальный тайтл и мета теги. Также в настройках вы можете запретить индексацию страниц меток и архивов.
Евгений 19.08.2014
В версии 3.9.2 не ‘adjacent_posts_rel_link’ а ‘adjacent_posts_rel_link_wp_head’
Tod 20.08.2014
Евгений, у меня в коде так и указано.
Olana 23.02.2015
А еще статья не должна быть слишком маленькой и слишком большой. Слишком маленькую быстро прочитают, а большую никто не захочет читать полностью. От этого зависят поведенческие факторы, чем больше посетитель задерживается на сайте, тем выше котируется сам сайт. из собственного опыта.
Tod 23.02.2015
Olana, есть разные тематики и разные пользователи. Главное, чтобы в статье раскрывалась суть вопроса и посетитель нашел нужные ответы. Если это развлекательная информация, то конечно никто читать не захочет, но если техническая, то тут материал может занимать большой объем.
Сергей 03.10.2015
Здравствуйте! Как написать название сайта красивыми буквами?
Tod 04.10.2015
Сергей, можно написать в фотошопе с помощью оригинальных шрифтов и добавить картинку в шапку сайта либо использовать CSS стили.
Александр 11.10.2015
Привет подскажите пжлст — в шапке =в хедер= прописывается вирус, чищу + закрываю права 444 и через сутки тожсамое
Tod 11.10.2015
Александр, я бы попросил хостера почистить вирус. Второй вариант — полная переустановка вордпресс с удалением всех файлов, которые можно удалить. То есть оставить только пару системных файлов и картинки — саму ВП + модули ставить с нуля. Также можно глянуть плагин Theme Authenticity Checker для проверки внешних ссылок в шаблоне.
Александр 11.10.2015
да чистилши они и переустановили серв и движк4и я обновил — видимо шел или еще что-то — это на 5 сайтах и + в записях какой то код тож вир
Tod 12.10.2015
Александр, тогда нужно как-то вычислять его методом исключения — поменять временно шаблон, отключить модули, перезалив систему с нуля и посмотреть будет ли вирус. Дальше варианты — сменить хостинг, доступы к ФТП поменять и т.п. Можно погуглить похожие проблемы в англоязычном сегменте блогов.
Александр 12.10.2015
спасибо за помощь.. тока проще все поудалять — там щас в каждой записи вир и в шапках бесконца .. да пусть бультыхаются они толком бесполезные
Ксения 24.02.2016
Здравствуйте, есть ли какой-нибудь способ контролировать порядок вывода кода функцией wp_head(); т.е мне не нравится что у меня идет тайтл, потом идет куча кода выводимого wp_head, а потом где то внизу идет дескрипшн и кейвордц, так же выводимые функцией wp_head (у меня это делает плагин ALL in SEO pack)
Tod 25.02.2016
Ксения, если честно, не интересовался этим вопросом, поэтому не могу подсказать. Сложно, наверное, упорядочить весь этот код т.к. он генерируется из разных источников — что-то из шаблона, что-то из функций системы + вставки плагинов.
ALex 31.05.2016
Подскажите, пожалуйста, как удалить комментарий в head: ««
Tod 01.06.2016
ALex, код не вставился, можете отправить вопрос на почтуstod84@gmail.com.
Михаил 01.10.2016
Автору РЕСПЕКТ!!! Статья просто находка для меня. Спасибо большое.
сеошник 16.11.2016
Статья помогает оптимизаторам добиваться продвигаемым сайтам быстрее грузится у посетителей сайта (актуально у кого маленькая скорость) и дополнительным бонусом — поисковики любят «ухоженные» сайты когда нет в них ненужного информационного мусора.
vadosss 25.12.2016
Огромное спасибо за представленную информацию, все пригодилось и помогло, теперь 99 баллов по pagespeed и все работает!!!)))
Павел 23.05.2017
Спасибо!
Ashot 11.12.2017
Здравствуйте, у меня есть вопрос я хочу изменить код в файле header.php точнее изменить вид меню у меня есть новое меню которое состоит html и css кодов. Могу ли я вложить готовый css файл в вордпресс?

Заранее спасибо за желание и готовность помочь!!!