Главная Web-разработка Как добавить код в head для отдельной страницы сайта на WordPress
Как добавить код в head для отдельной страницы на сайте WordPress.

Как добавить код в head для отдельной страницы сайта на WordPress

Автор: Юрий
22 просм.
Поделитесь с друзьями!
  • 1
  • 1
  • 1
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
    3
    Поделились

Как вы наверняка знаете, иногда нужно вставить на страницу что-нибудь этакое, чтобы оно работало только на этой странице. Например, в посте разместить некий исполняемый код со скриптами. Для этого обычно нужно подключить в блоке head некий код, например, подключить необходимые скрипты. Но как это сделать для отдельной записи?

В чём суть проблемы?

На самом деле это важная проблема, когда вы хотите расширить функционал своего сайта. Но тогда вам придётся добавлять кучу кода в свой шаблон. При этом вы получаете следующие проблемы:

  • Не сможете спокойно обновлять свой шаблон, так как весь добавленный в него вручную код при обновлении исчезнет. Его придётся каждый раз добавлять заново.
  • Большое количество разного кода в секции head замедляет сайт. К тому же, этот код может использоваться только на некоторых страницах, а загружаться будет на всех. Это не только непрактично, но и нелогично.

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

Но в WordPress это сделать не получится, так как здесь используются шаблонные темы. То есть, блок head здесь находится в отдельном файле header.php, который применяется на всех страницах. Когда вы добавите туда свой код, он появится на всех страницах без исключения.

Я столкнулся с этой проблемой, когда зарегистрировался в партнёрской сети Яндекс Маркета. Там можно создавать блок для любого товара и вставлять его на свою страницу. Это очень удобно для обзорных статей, так как в этом блоке сразу показываются свежие цены и адреса магазинов. Можно вывести отзывы или, например, характеристики.

Для вывода рекламного блока в статье там нужно вставить на страницу два типа кода. Вот, смотрите, какой огромный блок надо добавить в блок head, и какой маленький – собственно в текст. Для каждого блока первый код разный – вот в чём проблема.

Как вставить код в head

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

Решение я нашёл быстро, это достаточно удобный плагин, который полностью решает возникшую проблему.

Плагин Header Footer Code Manager

Как установить этот плагин, объяснять подробно не буду – переходите в «Плагины» — «Добавить новый», вставляете и находите его.

После активации в админке внизу появляется пункт HFCM, в котором есть пара вкладок – «All snippet», то есть «Все сниппеты», и «Add new» — добавление нового. Сниппеты – это кусочки кода, которые вы хотите добавлять в секцию head или в секцию footer. То есть плагин позволяет добавлять свой код как в шапку, так и в подвал сайта. Причём делать это можно для разных страниц отдельно.

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

Как добавить код в head для отдельной страницы WordPress

Итак, переходим в «HFCM» — «Add New». Перед нами появляется такая страница, где можно очень быстро заполнить все поля. Большинство – просто списки, где надо только выбрать нужный вариант.

Настройки сниппета в плагине Header Footer Code Manager

Настройки сниппета в плагине Header Footer Code Manager.

Так как всё на английском, рассмотрим каждый пункт, хотя там всё очень просто:

Snippet Name – имя сниппета. Пишите понятно, чтобы потом было удобно разобраться, если их будет много. Это как имя для страницы, никто его видеть не будет, кроме вас.

Site Display – куда вставлять код. Здесь просто список готовых вариантов:

  • Site Wide – по всему сайту. Если выбрать этот вариант, появятся дополнительные поля «Exclude Pages» и «Exclude Post», где можно выбрать страницы и посты, на которых вставку надо исключить. То есть код будет на всех страницах сайта, кроме выбранных.
  • Specific Post – вставить только в определённые посты, что нас и интересует. Ниже появится поле, где можно выбрать один или несколько постов, где и будет вставлен код.
  • Specific Page – определённые страницы, на которых будет вставлен код сниппета. Также надо выбрать их в поле ниже.
  • Specific Categories – в категориях, или рубриках. Ниже выбираем нужные рубрики из списка, в архивах которых будет вставлен код.
  • Specific Post Type – тип постов. Если у вас есть разные типы постов, например, обычные стандартные, портфолио, или ещё какие-то, то здесь можно выбрать. Код вставится только на страницах этого типа.
  • Specific Tags – метки, или теги. Также надо выбрать из имеющегося списка, как и с рубриками.
  • Latest Post – последние посты. Ниже надо выбрать количество.
  • Shortcode Only – код не будет вставлен автоматически, но вы получите шорткод. Его вы сможете вставить в текст любой страницы в нужном месте.

Location – в какое место страницы вставлять сниппет:

  • Header – в шапку, то есть как раз в head, куда нам и надо.
  • Before Content – перед контентом страницы.
  • After Content – после контента, например, в конце статьи.
  • Footer – в подвале.

Device Display – тип дисплея. Здесь можно выбрать такие варианты:

  • Show on All Device – код будет вставлен при просмотре сайта с любых устройств – компьютеров, смартфонов, планшетов.
  • Only Desktop – код будет вставлен только при просмотре с компьютера.
  • Only Mobile Device – только для мобильных устройств.

Status – здесь только два варианта. Позволяет включить или отключить сниппет, не удаляя его полностью:

  • Active – включено.
  • Inactive – выключено.

Snippet/Code – самое большое поле. В него, собственно, и вставляется нужный код.

Как видите, плагин Header Footer Code Manager позволяет вставить код не только в блок head, но и в другие места, в том числе перед и после контента. То есть с его помощью удобно вставлять, например, рекламные блоки Яндекс Директ или Google Adsence. Мало того, он имеет преимущество перед специализированными плагинами для вставки рекламы, так как позволяет выбрать конкретные рубрики или страницы, или исключить их из вставки. В этом плагине всё настраивается легко и гибко.

Для вставки кода в head отдельной страницы у меня, например, получился вот такой сниппет:

Вставка кода в head отдельной страницы

Он выводится только на одной обзорной статье, на других ничего не вставляется.

Вот и всё, теперь вы знаете, как быстро и просто добавить код в head отдельной страницы на сайте WordPress. Да еще и получили довольно мощный инструмент, который при умелом использовании очень поможет расширить функционал страниц, не перегружая лишним кодом весь сайт. Да и плагин для вставки рекламы можно отключить – есть же Header Footer Code Manager, который делает то же самое, только больше.


Поделитесь с друзьями!
  • 1
  • 1
  • 1
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
    3
    Поделились
0 комментарий

Другие полезные статьи

Оставьте своё мнение

* Используя эту форму, вы соглашаетесь с хранением и обработкой ваших данных на этом сайте.

Мы используем технологию cookie для лучшего представления сайта. Продолжая пользование сайтом, Вы выражаете своё согласие. Ок Подробнее...