Как правильно добавить код в head в WordPress, не испортив верстку
Настройка WordPress
Ежедневно маркетологам, вебмастерам и блогерам приходится работать с разными метриками. Подключить их можно только если добавить код в head. Посмотрим, как это легко сделать на WordPress, не нарушив работу ресурса.
Что находится в <head>?
Если тег <body> содержит исполняемый и выводимый код, который влияет на внешнее восприятие ресурса, то хеад дает технические инструкции:
- Инструкции, выполняемые поисковыми роботами
- Руководства для браузеров (хуки)
- Передаваемые мета-теги
- Введение дополнительных ресурсов (например файлы с CSS стилями для WordPress)
Как добавить код через WordPress плагины
Способ, который будет удобен любому человеку, даже недостаточно разбирающемуся в тонкостях кода. Им легко добавить фрагменты.
Используя Clearfy PRO
Небезызвестное дополнение от русских разработчиков, ориентированное на повышение уровня технического SEO. Одна из возможных операций – внесение в тег head.
Чтобы найти эту функцию (и добавить её), сначала надо перейти в конфигурацию плагина (правое боковое меню в админке WordPress), затем в меню “Код”, после скролльте до пункта. Там же можно и удалить стили.
ВордПресс плагин для вставки кода Paje inject
Тот случай, когда вопроса “что это” после прочтения заголовка не возникает.
Универсальность этого модуля заключается в том, что он позволяет добавить строки любого языка программирования в различные разделы страницы: шапку (header), тело (body) и подвал (footer).
Кроме того, вносимые изменения могут отличаться для различных типов страниц, версий сайта (десктопной и мобильной) и отображения, однако они влияют на весь шаблон.
Установить в WordPress
Через редактор файлов
Метод, который я рекомендую только опытным вебмастерам/сисадминам. Для правильной вставки html/php в хедер необходимо учитывать особенности языков программирования (и знать их хотя бы на самом минимальном уровне).
Для редактирования откройте панель управления сервером (к примеру – ispmanager) или скачайте документ посредством FTP клиента. Теперь необходимо вставить имеющийся код.
Где находится нужный нам файл: wp-content/themes/header.php.
После введения новых элементов внимательно проверьте сайт на возможные ошибки W3C валидатором html (и JS скриптов) и на визуальные ошибки.
Как добавить код в head wordpress?
Доброго времени суток друзья. Сегодня пойдет речь как добавить код в head сайта на WordPress.
Открываем редактор тем Wordpess.
Так как я не сторонник дополнительных плагинов и вам не советую ими быть. То речь пойдет о просто добавлении кода в тему самого сайта из админки WordPress. Для этого нам стоит перейти в админку сайта по адресу «url вашего сайта/wp-admin» и выбрать раздел «Внешний Вид -> Редактор тем»
Находим файл head в WordPress.
Далее перед нами откроется сам Редактор Тем WordPress. С правой стороны мы увидим с вами список файлов нашей темы которая сейчас активна. Пролистываем вниз если это нужно и выбираем файл header.php . Кликаем по нему левой кнопкой мыши.
Добавляем код в файл Header WordPress.
Далее мы увидим с вами файл в HTML разметке. Наша задача добавить нужный нам код между тегами <head> открывающим и </head> закрывающим. Для этого я советую добавить новую стройку с помощью кнопки Enter и вставить ваш код.
Простой способ добавить код в шапку и подвал WordPress-сайта
В WordPress нет инструмента для добавления кода в шапку или подвал сайта. К счастью, существует простое стороннее решение для начинающих.
Лучший способ добавить код в шапку и подвал WordPress-сайта
Существует три способа, с помощью которых можно добавить код в шапку и подвал WordPress-сайта:
- Путем редактирования файлов header.php и footer.php используемой темы оформления.
- Через встроенный функционал темы оформления.
- С помощью плагина.
Первый вариант не подходит для начинающих, так как он подразумевает непосредственное редактирование кода файлов header.php и footer.php вручную. Кроме этого при обновлении используемой темы оформления добавленный в нее пользовательский код будет удален.
Некоторые темы оформления WordPress, такие как Elegant Themes и Genesis Framework от StudioPress , предоставляют функционал для быстрого добавления кода в шапку и подвал. Но если изменить тему, то исчезнут все сниппеты, добавленные на сайт.
Поэтому мы всегда рекомендуем использовать плагин. Это самый простой и безопасный метод. Для этого был создан бесплатный плагин Insert Headers and Footers .
Преимущества использования плагина Insert Headers and Footers:
- Позволяет легко и быстро добавлять код в шапку и подвал сайта. А также помогает упорядочить элементы, так как хранит все элементы кода шапки и подвала сайта в одном месте.
- Помогает предотвратить ошибки, которые могут возникнуть при редактировании файлов темы оформления вручную.
- Плагин хранит код шапки и подвала сайта в отдельном месте. Поэтому можно безопасно обновлять или менять тему оформления.
Добавляем код в шапку и подвал WordPress-сайта
Установите и активируйте плагин Insert Headers and Footers . Затем перейдите в раздел Настройки » Insert Headers and Footers панели администрирования WordPress. После этого появятся два поля для добавления кода в шапку и подвал.
Вставьте необходимый код в одно из двух полей. Нажмите кнопку «Сохранить». Теперь плагин будет автоматически загружать код в соответствующих местах на WordPress-сайте.
Если случайно отключите плагин, код все еще будет храниться в базе данных WordPress. Поэтому можно будет просто переустановить или повторно активировать плагин, и код снова заработает.
Многие вебмастера используют плагин Insert Headers and Footers для интеграции сайта с Google Analytics. Но для этого мы рекомендуем применять специализированный плагин MonsterInsights . Он позволяет правильно настроить отслеживание Google Analytics в пару кликов и отображает полезную статистику прямо в панели администрирования WordPress.
Надеемся, что эта статья помогла вам узнать, как добавить код в шапку и подвал WordPress-сайта.
Как добавить код на сайт WordPress?
Привет, друзья! Сегодня у нас важная тема — Как добавить код на сайт WordPress без редактирования файлов? Практически на все создаваемые сайты приходится добавлять коды тех или иных сервисов (например, код счётчика Яндекс.Метрики, Google Analytics, мета-тег для подтверждения в Яндекс. Вебмастер), а в некоторых случаях необходимо добавить произвольный CSS/JS код, который будет выводится на всех страницах сайта. Читайте товарищи: Как добавить код в WordPress с помощью плагина LuckyWP Scripts Control.
Добавить код на сайт WordPress
Для решения этой задачи в WordPress есть несколько путей:
- Добавить код в тему вручную;
- Использовать уже готовые плагины.
Добавление кода вручную через тему влечёт за собой несколько проблем: при смене темы придётся переносить коды, а для добавления или изменения кодов всегда придется изменять файлы темы, что очень неудобно. Поэтому для решения этой задачи логично использовать плагины.
Плагин LuckyWP Scripts Control
Плагин LuckyWP Scripts Control позволяет добавлять и управлять произвольным кодом на сайте. Например, вы можете вставить код Google Analytics или Яндекс.Метрики, мета-тег для подтверждения в Google Search Console или Яндекс.Вебмастер, пиксель Facebook, произвольный CSS/JS и другой код без редактирования файлов темы.
Подавляющее большинство плагинов фактически добавляют в панели управления WordPress два поля, содержимое которых будет выводится в шапке (внутри тега <head>…</head> ) и в подвале (перед закрывающим тегом </body> ) соответственно. Но в этой статье мы рассмотрим наиболее интересный плагин — LuckyWP Scripts Control. Отличительной чертой плагина является очень удобный интерфейс: каждый блок кода добавляется отдельно, а порядок блоков и и их месторасположение на странице изменяется простым перетаскиванием.
Плагин опубликован в официальном репозитории WordPress ( https://ru.wordpress.org/plugins/luckywp-scripts-control/ ), поэтому установить его можно любым удобным способом. После установки и активации плагина в меню панели управления WordPress в разделе «Настройки» появится пункт «Скрипты».
Разместить код можно не только в области <head>…</head> и перед закрывающим тегом </body> , но и перед открывающим тегом <body> , что в некоторых случаях важно.
Как добавить код на WordPress
Для добавления нового кода нажимаем на кнопку «Добавить код» в соответствующей области. Откроется всплывающее окно:
В поле «Заголовок» вбиваем соответственно заголовок, он на сайте не выводится и нужен исключительно для удобства. В поле «Содержимое» добавляем необходимый код. Затем жмём «Добавить» и всё, код уже на сайте. Теперь при обновление темы WordPress код/скрипт/мета-тег никуда не пропадёт, он всегда будет на блоге ВордПресс.
- Добавление кода Google Analytics, Яндекс. Метрики и другие счётчики.
- Добавить мета-тега для верификации в Google, Яндекс, Mail.Ru и т. д..
- Вставить код Google Tag Manager
- Добавление кода пикселя Facebook.
- Вставка произвольных мета-тегов.
- Добавление произвольного JS/CSS/HTML кода.
Для управления порядком вывода скриптов и их местоположением нужно нажать на область слева от заголовка и перетащить скрипт в нужное место:
Любой скрипт можно скрыть/показать, отредактировать или удалить. При наведении на скрипт появляются соответствующие кнопки:
Любой скрипт возможно отредактировать:
Данный плагин решает на 100% возложенную на него задачу и при этом предельно прост и удобен в использовании. Рекомендуется к применению ��
Плагин LuckyWP Scripts Control переведён на русский язык и абсолютно бесплатен.
Надеюсь, товарищи, сегодняшний пост был вам полезен. До новых встреч, пока, пока.
По этой же теме:
1 комментарий к “Как добавить код на сайт WordPress?”
Спасибо автору за совет про это плагин. Ни как не мог настроить новый код для РСЯ. Кто не знал теперь код состоит из двух частей и надо в теги head поставить пердзагрузчик рекламы от Яндекс. Установил плагин, поставил код и сразу всё заработало.