вставьте этот фрагмент в html код сайта между тегами head и head
Как добавить код в head WordPress
Хотите быстро добавить код в head WordPress? Разберем простые и рабочие способы.
Код в шапку сайта вставляют с разных причин. Это может быть статистика от Google или Яндекс, JavaScript-скрипт какого-либо сервиса (например, реклама), новая функция сайта, CSS-стиль своего блока.
Зачем нужен блок в коде страницы?
Как добавить код в head WordPress?
Для ВордПресс есть несколько методов. Выбирайте тот, который вам удобен.
Через плагин
Этот способ самый простой и рекомендуется новичкам.
Head, Footer and Post Injections
Это бесплатное WP-расширение, которое самостоятельно добавляет код в head.
Для этого, во-первых, установите плагин.
После активации откройте в админке раздел Настройки > Header and Footer и перейдите на вкладку Head and Footer.
Страница выбранной вкладки имеет блок page section injection, который нам нужен.
Тут есть 2 текстовых поля. Первое отвечает за вывод в нем кода на всех страницах сайта. Второе добавляет код только на главной странице ВП-сайта.
Чтобы ваши изменения вступили в силу, не забудьте нажать кнопку Сохранить.
Clearfy Pro
Это премиальное решение для ВП имеет много полезных функций. В основном — это очистка ненужного кода. Одна из опций плагина — вставка кода в head. Для этого:
в Clearfy Pro» width=»1049″ height=»254″ srcset=»https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-5.png 1049w, https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-5-300×73.png 300w, https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-5-768×186.png 768w, https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-5-1024×248.png 1024w» sizes=»(max-width: 1049px) 100vw, 1049px»/>
Через правку шаблона темы
Если вы не хотите устанавливать дополнительные плагины на свой веб-ресурс, то код в head можно добавить вручную в нужном шаблоне вашей WordPress-темы.
Для этого перейдите в каталог wp-content/themes и найдите файл header.php.
В каждой теме содержимое файла header.php может отличаться. Но основные его блоки похожие.
» width=»1009″ height=»451″ srcset=»https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-4.png 1009w, https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-4-300×134.png 300w, https://wpplus.ru/wp-content/uploads/2020/03/dobavlyaem-kod-v-head-4-768×343.png 768w» sizes=»(max-width: 1009px) 100vw, 1009px»/>
Через хук WordPress
ВордПресс имеет специальный хук, который добавит код в head. Чтобы его использовать, откройте файл functions.php. Это основной конфигурационный файл темы, который находится в корне ее папки. Например, для указанной темы он находиться по адресу
Чтобы добавить стиль или скрипт в шапку сайта, в самый конец этого файла вставьте код
Размещение кодов в блоках head и body
На некоторых сайтах для размещения различных кодов (счетчиков, информеров, пикеслей ретаргетинга, кодов Google Analytics и Яндекс.Метрики и т.д.) предусмотрены отдельные блоки для вставки.
Данные блоки позволяют буквально в несколько кликов вставить нужный код, без правки шаблонов сайта.
Рассмотрим, как они работают.
Шаг 1
Раскройте меню «Настройки» и перейдите к пункту «Настройки сайта».
Шаг 2
На открывшейся странице в разделе «Блоки сайта» слева вы сможете найти блоки «Блок с кодом head» и «Блок с кодом body».
Обратите внимание!
Шаг 3
Теперь, если вам необходимо вставить какой-либо код в тег head, просто нажмите на данный блок в списке, вставьте в открывшемся окне код и сохраните изменения (аналогично с тегом body).
Примеры:
У меня в «Настройках сайта» нет таких блоков. Что делать?
Не все сайты предусматривают описанные выше блоки. Если у вас в системе управления их нет, то вставить код вы можете следующим образом:
В открывшемся списке шаблонов выберите шаблон «Главная.Верх»;
Вставить код в раздел head на WordPress – темы, плагины и php функции
Большинство скриптов и систем аналитики требуют чтобы подключение к серверам происходило в шапке сайта, где располагается вся служебная информация. Чтобы добавить код в head WordPress не нужно придумывать сложных схем, стоит применить некоторые методы, описанные в статье.
Не путайте head и header, второй это тег семантической разметки сайта, который отображается и показывает, что здесь находится шапка сайта.
Если шаблон не обновляется
Самый простой методом – добавить код напрямую в файлы шаблона. Но есть несколько ограничений:
Открываете файл header.php (находится в корне темы), обычно он отвечает за показ первого экрана в WordPress. Используйте соединение по FTP, чтобы при ошибках откатить изменения. Я покажу на примере стандартного редактора в админке WP.
Перешел в редактор тем, нашел файл, потом вставил тестовый тег и обновил. Так он выглядит на главной странице.
Если обновляется, то данный метод сразу не подходит, переходим к другим способам.
Темы с возможностью добавлять код html в head
Возможно вы не знаете обо всех функциях своего шаблона, полезно будет изучить настройки, может быть в нем есть область для записи произвольного кода в хеад. Например, в теме Reboot есть такая возможность Внешний вид – Настроить.
Видим текстовую область, вставляете туда необходимый скрипт или мета информацию, и обновления уже не страшны. Посмотрите повнимательнее, проверьте все вкладки, скорее всего такая возможность для контента есть.
Если не нашли таких настроек, то переходим к другим методам, чтобы добавить код в раздел в хеад.
Применяем плагин ClearfyPRO
Любимый ClearfyPRO умеет все, также прописывать html и другие виды спецификации в head блога.
Есть переключатель можно на время отключить отображение, чтобы не приходилось стирать и заново загружать код. Аналогично можно удалить стили recentcomments. Полезно узнать что ClearfyPRO оптимизирует, ускоряет и улучшает seo в WordPress дополнительно по 49 требованиям. Для читателей WPCourses делаем скидку на покупку.
Плагин для вставки кода Head & Footer Code
Применяем PHP инструкцию
Помещаем его в файл function php. Видим место куда добавлять, вводите любой HTML и js script, после сохранения изменений, ваша функция выведется после отработки основных сценариев wp_head. Также отключается xml rpc протокол в WordPress.
Применяя четыре простых способа смогли добавить любой код в head любимой CMS WordPress, советую использовать плагины, если нет подходящих мест в шаблоне.
Создание HTML-сайта: Работа с тегом head. Создание первой html-страницы.
Здравствуйте, уважаемые друзья, блога sdelaemblog. Сегодня продолжим изучение html-кода. И наконец-таки приступим к созданию HTML-страниц сайта. Сегодня еще немного технической информации и в следующих статьях приступим непосредственно к созданию сайта. В прошлой статье, о структуре HTML-кода, мы говорили об обязательных тегах, которые должны быть использованы в html-документе. И один из таких тегов, был тег head, который отвечает за «техническую» часть html-документа. Как мы помним, содержимое данного тега не выводится на страницу, за исключением тега title, который назначает заголовок страницы. И его можно увидеть, например, во вкладке браузера.
Сегодня мы попробуем разобраться, что нужно писать между тегами head и для чего? И в завершении, чтобы не было совсем скучно, выведем какую-нибудь информацию в «теле» документа.
И второе, что нам понадобится, для создания, это текстовый редактор. Можно использовать стандартный блокнот, он для этого подойдет, но я предпочитаю, и вам рекомендую использовать текстовый редактор NotePad++. В нем работать будет гораздо удобнее и проще. Тем более, если вы новичок.
Теперь, перейдем к ответам на обозначенные вопросы в начале статьи.
Что нужно писать между тегами head и зачем?
Открываем папку, которую только что создали. И в ней создаем новый текстовый документ. Назвать его можно, как угодно. Только использовать в названии лучше латиницу, а не кириллицу. Назовем его, например, main. Что будет означать, что это у нас главная страница.
Теперь открываем файл в текстовом редакторе. На данный момент это пустой файл в формате txt. Давайте исправим это недоразумение.
Для начала возвращаемся к истокам. И в первой строке документа указываем необходимый DOCTYPE. Затем, прописываем все обязательные теги, о которых мы говорили в статье о структуре html-документа. У меня в итоге получился такой код:
У вас DOCTYPE может быть другим, в зависимости от выбранного.
Теперь, чтобы было удобней. Необходимо поменять синтакис документа, при использовании NotePad. Для этого, в верхнем меню выбираем «Файл», затем «Сохранить как», и в появившемся окне, в графе «Тип файла», необходимо выбрать «Hyper Text Markup Language file». И нажать на кнопку «Сохранить». После чего, наш документ становится файлом формата html.
Да, при этом текстовый документ в папке может остаться. Его можно удалить, так как он нам больше не нужен.
Итак, обратим внимание на теги head. На данном этапе, между тегами указан только заголовок страницы и ничего более. Но, что же нужно написать еще между данными тегами. И самое главное зачем? Давайте разбираться.
Для начала, предлагаю изменить заголовок документа. Для этого, пишем нужное словосочетание между тегами title. Например, я напишу: «Главная страница HTML-сайта».
Теперь, чтобы ускорить процесс, я выложу готовый код. А затем расскажу что для чего нужно.
Итак, теперь по порядку:
Теперь, я надеюсь, мы поняли, что желательно указывать между тегами head и зачем?
Создание первой html-страницы.
Сейчас, если мы скопируем данный код и вставим в наш html-документ. Сохраним его и откроем в веб-браузере — будет отображена пустая страница. И чтобы увидеть уже хоть какой-то результат на этом этапе, я предлагаю, написать между тегами body что-нибудь. Что не имеет никакого значения. Для вывода текста воспользуемся одним из тегов заголовка. Например, первого уровня. Таким образом, код между тегами body должен выглядеть так:
После того, как текст написан, сохраняем документ. И открываем его в браузере. И на этом этапе мы сразу можем столкнуться с проблемой. Вместо текста отображаются какие-то символы, например, вопросительные знаки. Почему же так получилось? Все очень просто. Мы просто не преобразовали наш документ в необходимую кодировку. Возвращаемся в текстовый редактор. В верхнем меню выбираем «Кодировки» и в выпавшем списке выбираем пункт «Преобразовать в UTF-8». После чего, сохраняем файл и обновляем страницу. Если все сделано правильно, текст должен стать читаемым.
Что еще мы можем сделать? Чтобы наша первая страничка стала немного красивее. Мы можем, например, залить цветом фон страницы и покрасить заголовок в какой-нибудь цвет. И для этого, мы будем использовать каскадную таблицу стилей. Между тегами head, чуть раньше мы уже подключили файл со стилями, но его еще нет. Значит, его необходимо создать.
Для этого в NotePad нажимаем «Файл» и выбираем «Новый» Или же просто нажимаем сочетание клавиш Ctrl+N. После чего прописываем стили CSS. Для примера сделаем фон, покрасим текст заголовка и расположим его посередине страницы и на этом закончим. После указания стилей, не забываем преобразовать документ в UTF-8. Выбираем «Сохранить как», называем документ style и сохраняем в формате CSS.
Получается примерно такой код. Цвета могут быть другими, для того, чтобы подобрать необходимый цвет зайдите на эту страницу:
Да, кстати, рекомендую все предлагаемые коды не копировать и вставлять, а прописывать самостоятельно. Так будет намного полезней, нежели просто копировать.
Итак, что мы имеем? А имеем мы заполненную техническую часть документа, что находится между тегами head. А также первую html-страницу, созданную самостоятельно. Да, в ней нет ничего особенного, но первый шаг к созданию HTML-сайта сделан. А в следующий раз мы продолжим, и приступим к созданию главной страницы сайта. Подписывайтесь, чтобы не пропустить.
Вставьте этот фрагмент в html код сайта между тегами head и head
Перед созданием новой темы, пожалуйста, ознакомьтесь с FAQ по LinkorCMS
Куда вставлять код?
Решил я поучаствовать в одном интересном проекте. Там для того чтобы стать полноценным партнёром надо:
С 1-м пунктом я конечно разобрался (я же всё-таки опытный пользователь 
), а вот со 2-м условием никак, поскольку не знаю какой файл надо отредактировать и куда предпочтительней вставлять этот код.
Уважаемые создатели, подскажите пожалуйста!
Заранее благодарю.
Куда вставлять код?
Всё равно НЕ ПОНЯТНО. Я лишь предполагаю, что нужный файл находится в папке templates где есть основные файлы конфигурации отображения сайта. Но там (в этой папке) много файлов и какой из них надо редактировать мне НЕПОНЯТНО.
Бумблик:
Не правильно Вы понимаете.
www\templates\*ваша_тема*\init.php открываете блокнотом и вставляете строку
Сразу видно человек либо Linux или Win программист!
Нет. Строчка является PHP кодом, а PHP код не исполняется в статьях. Тут логично в тему вставлять или даже плагин набросать (но проще конечно в тему. ). А еще поле «Другие мета теги» к вашим услугам (в настройках сайта в админке).
Mnml Mouse:
Ну-ну. Выводом head секции действительно занимается шаблонизатор, в теме находится лишь представление для body секции. Но никто не мешает использовать API шаблонизатора, тем более свойство OtherMeta публично. Хоть оно по идее и предназначается для вставки всяких мета тегов в конец head, но можно вставить любой код.
Файл init.php является самым обычным php файлом с кодом, который исполняется при подключении темы. Никто не мешает встроить туда условие (пусть даже не очень хорошо мешать логику с представлением) и вставлять код через дергание шаблонизатора. Кстати, CSS и JS файлы так и подключаются. Ну и в шаблонах тоже можно делать PHP вставки, так как они инклудятся с буфферизацией вывода. Выходит, что и код исполнен в них, и вывод получен для дальнейшей обработки шаблонизатором.
Mnml Mouse:
Это в корне влияет? Может все же PHP программист, ведь не программирование под операционки обсуждаем. Ради интереса хочу у вас поинтересоваться тем, а какой я программист? (: Перечитав ваш ответ правда, так и не понял каким программистом является gadget: «linux или windows» сводится к тому, что выбор то и состоит из win или unix-подобного, что и было отмечено.