Web5X - Готовые сайты

Блог о создании сайта, конструкторе сайтов и Elementor

Свой код в шапке или подвале. Как добавить?

При создании сайта или его развитии, мы часто сталкиваемся с разными мелочами, а точнее рутиной, такими как вставка различного JS и HTML кода в структуру вебсайта, например счетчика метрики, аналитики, подтверждения и прочее (Google Analytics, Google Tag Manager, Google Ads Conversion, Facebook Pixel, Google site verification, Yandex site verification, Yandex Metrika).

Обычно многие даже не задумываются о совместимости, проблемах, правильности решения, а сразу (начитавшись интернета) идут в шаблон и редактируют его. В каких то особенных случаях такие решения возможно оправданы, но ситуации бывают совсем различны. Например, вы обновили шаблон и все изменения ваши пропали. Теперь необходимо опять вспоминать где вы взяли код счетчика для сайта, код js консультанта, и прочее.

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

Плагин Head & Footer Code

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

Скачать плагин тут https://wordpress.org/plugins/head-footer-code/

Универсальный плагин сниппетов Code Snippets

Это отличный плагин для вставки php кода в структуру сайта на wordpress, а точнее выполнение php кода. С помощью данного плагина можно запустить любой PHP код на вашем сайте, в том числе и для встраивания JS и HTML кода или создания шоткода для вашего сайта. В плагине нет ничего лишнего, а управления созданными сниппетами, доставляет только удовольствие.

Плагин подойдет тем, кто хоть раз создавал самостоятельно шоткод в стиле
add_action( 'wp_head', function ()

Плагин можно скачать по ссылке https://wordpress.org/plugins/code-snippets/

Встроенные средства Elementor PRO

В функционале Elementor Pro есть возможность вставки своего кода на сайт. Мало того, можно добавить в тело страницы свой js или html код, так и с помощью отдельной настройки можно управлять вставками в шапке или подвале.

Данный функционал называется Пользвательский код или Custom Code. Функция пользовательского кода позволяет добавлять CSS и фрагменты кода, такие как код Google Analytics или пиксельный код Facebook, и назначать их для загрузки в выбранном вами месте с установленным приоритетом. Нет необходимости редактировать файлы вашей темы.

Чтобы добавить код, просто нажмите добавить Пользовательский код, Element or > Custom Code > New code.

Здесь вы сможете добавить свой пользовательский фрагмент кода в интеллектуальный редактор кода, выбрать местоположение со структурой страницы для его включения (например, либо в элементе заголовка страницы, либо в начале или конце тега body), и установить его приоритет выполнения. Если вы зарегистрируете два скрипта в одном и том же расположении, установленный вами приоритет определит, какой из них загрузится первым (от 1 до 10 - самый важный, от 10 - наименее важный). Наконец, вы можете назначить условия отображения точно так же, как для любого элемента или части сайта (Шапка, подвал и т.д.). Как только вы закончите, опубликуйте свой код, и он будет доступен на вашем сайте.

Иногда не удобно работать с пользовательскими стилями, например писать их в маленьком окошке в настройках Elementor. Но и это не беда. С помощью данного функционала, вы можете добавить свой CSS код и редактировать его удобно в большом окне браузера. И все так же действует возможность управлять отображением.

Заключение

Как видите, не так страшно делать сайт удобным и безопасным. Используйте описанные выше решения и они вас не подведут! Главное помнить, ели вы редактируете код шаблона на фтп или в редакторе темы, вы должны знать и понимать опасность своих действий на сайте, а так же обязаны знать как можно вернуть все обратно, если сайт сломался.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Реклама

Готовые сайты за 3000 рублей. Купить готовый сайт с конструктором это реально. А создать сайт можно дешево, быстро и просто. Купить сайт на web5x.ru

Конструктор сайтов Elementor Pro вы можете отдельно купить от 49$
Купить Elementor Pro

Блог о создании сайта, конструкторе сайтов и Elementor.
Авторские права © 2017-2021 . Все права защищены.
Готовые сайты на web5x.ru
Политика конфиденциальности