Как добавить код в head WordPress

👍 Научим создавать сайты на WordPress бесплатно за 19 уроков. Подробнее →

Нужно добавить код в head WordPress? Разберем как это сделать, чтобы не нарушить работу сайта.

В шапку сайта вставляют Google- и Яндекс-статистику, JavaScript-скрипты  внешних сервисов (например, реклама), CSS-стили своих блоков.

Зачем нужен блок <head> в коде страницы?

Это контейнер, в котором размещаются данные о данных (метаданные). Он находится между HTML-тегами <html> и <body>. Данные этого блока не отображается в браузере, но помогает ему обработывать страницы. Помогает поисковикам индексировать сайт.

Как добавить код в head WordPress?

Для ВордПресс есть несколько методов. Посмотрите все и выберите удобный для себя.

Отдельные плагины

Этот способ самый простой и рекомендуется новичкам. Для ВП есть плагины, которые сами добавляют ваши данные в шапку веб-ресурса. Они удобны, если вы не хотите “играться” с кодом и править файлы сайта.

Clearfy Pro

Это платное многофункциональное решение для ВП от команды WPShop.ru. Одна из возможностей плагина – вставка кода в head. Для этого нужно:

  1. Установить расширение.
  2. Открыть админ-раздел Clearfy Pro.
  3. Перейти на вкладку Код.
  4. Вставить свой код и активировать опцию .

Опция Код в <head> в Clearfy Pro

Активировать промокод на 15%

Head, Footer and Post Injections

Это бесплатное WP-расширение, которое служит только для одной цели – добавляет код в head.

После установки и активации откройте в админке раздел Настройки > Header and Footer, перейдите на вкладку Head and Footer.

Главная страница настроек плагина Footer and Post Injections

Найдите блок <HEAD> page section injection.

В левом блоке код, который нужно выводить на всех страницах сайта. В правом – только на главной странице.

Поля для вставки кода в head в плагине Footer and Post Injections

Не забудьте нажать кнопку Сохранить.

Правка шаблона темы

В этом способе код в head нужно добавлять вручную в нужном шаблоне WordPress-темы. Подойдет тем, кто не хочет ставить оеще один плагин.

Откройте файл wp-content/themes/header.php.

Не рекомендуем править файлы родительской темы ВордПресс. Для этого используйте дочерние темы. Они дают возможность править файлы без опасения, что изменения пропадут при обновлении темы.

В каждой теме содержимое файла header.php может отличаться.

Для примера откроем этот файл в стандартной WP-теме Twenty Twenty. В самом начале будет блок <head>…</head>.

Файл header.php темы Twenty Twenty

Нужный код добавьте перед закрывающим тегом </head>.

Добавленный код в раздел <head>

Через хук WordPress

В ВордПресс есть хук, который добавит код в head. Для этого откройте основной конфигурационный файл темы functions.php. Находится в корне ее папки. Например, для нашей темы

/wp-content/themes/twentytwenty/functions.php

Чтобы добавить стиль или скрипт в шапку сайта, в самый конец этого файла вставьте код

function wpschool_insert_header() {
    ?>

    <!-- Ваш код -->    

    <?php
}
add_action( 'wp_head', 'wpschool_insert_header' );

Вместо строки <!– Ваш код –> добавьте свой код и сохраните изменения. Теперь они работают на всех страницах ресурса.

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

Создай свой первый сайт на WordPress
Если Вам понравилась статья — поделитесь с друзьями
Михаил Петров
Привет! Меня зовут Михаил Петров. Я копирайтер и занимаюсь этим с 2013 года. Скрупулезность и ответственность - моя фишка! Не могу делать как попало и добиваюсь, чтоб заказчик сказал минимум “неплохо”. За все время своей работы пришлось написать и отредактировать немало разной “текстовухи”, включая SEO-тексты, отзывы и прочую чушь. На сегодняшний день специализируюсь на написании информационных статей и руководств технического направления. Вижу смысл и светлое будущее в текстах для людей, а не для машин.
Задать вопрос