Добавление кода в верхний или нижний колонтитул WordPress

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

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

В этом посте мы объясним несколько случаев, когда вам может понадобиться или вы захотите добавить код в верхний и нижний колонтитулы вашего сайта WordPress. Затем мы поделимся пошаговыми инструкциями для двух методов, позволяющих редактировать эти элементы для создания пользовательского верхнего или нижнего колонтитула. Давайте начнем!

Зачем редактировать код верхнего и нижнего колонтитула WordPress?

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

Тем не менее, это также лучшие места для кодов отслеживания, таких как тот, который используется для Google Analytics. Эти коды могут предоставить ценную информацию о поведении пользователей для улучшения ваших маркетинговых и контент-стратегий.

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

Наконец, вы можете быть знакомы с практикой перемещения кода JavaScript, блокирующего рендеринг, «вниз сгиба». Обычно это означает добавление его в нижний колонтитул WordPress, что потребует редактирования его кода. Этот метод может помочь улучшить производительность вашего сайта за счет сокращения времени загрузки.

Как добавить код в верхний или нижний колонтитул WordPress вручную (в 2 шага)

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

Шаг 1: Создайте дочернюю тему

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

К счастью, процесс создания дочерней темы вручную довольно прост, и вы можете получить доступ к руководствам по WordPress, которые вам понадобятся для настройки заголовков. Однако, если вам нужно создать дочернюю тему в крайнем случае, может помочь плагин для создания тем, такой как Child Theme Configurator.

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

Шаг 2. Отредактируйте файл functions.php вашей дочерней темы

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

Обычный способ редактирования файла functions.php — через протокол передачи файлов (FTP) и FTP-клиент, например FileZilla. Однако вы также можете редактировать определенные файлы с панели управления WordPress. Чтобы получить к нему доступ, перейдите в «Внешний вид» > «Редактор тем» .

Вы получите предупреждение о том, что собираетесь редактировать файлы своей темы — нажмите кнопку «Я понимаю» , чтобы продолжить. Далее вам нужно убедиться, что вы выбрали правильный файл. На боковой панели справа от редактора сайта убедитесь, что выбраны функции темы (functions.php) .

Теперь вы можете добавить свой собственный код в конец этого файла и нажать «Обновить файл» , когда закончите.

Как добавить код в верхний или нижний колонтитул WordPress с помощью плагина (за 2 шага)

Хотя в некоторых случаях может быть проще вручную отредактировать файлы вашей темы WordPress, чтобы добавить код в раздел нижнего колонтитула или заголовка, использование плагина обычно является более безопасным путем. Для целей этой статьи мы будем использовать один из самых популярных и высоко оцененных плагинов для задачи Header, Footer and Post Injections.

Однако в каталоге плагинов WordPress и в других местах есть много плагинов, которые могут помочь с этой задачей.

Шаг 1: Установите и активируйте выбранный вами плагин

Для начала вам необходимо установить и активировать плагин, который вы хотите использовать. Вы можете сделать это, загрузив ZIP- файл плагина из каталога плагинов или другого интернет-магазина, а затем загрузив его на свой сайт. Либо перейдите к «Плагины» > «Добавить новый» на панели инструментов.

Здесь вы можете найти плагин нижнего колонтитула или заголовка, который вы хотите использовать. Какой бы метод вы ни выбрали, вы закончите этот шаг, нажав кнопку «Установить» , а затем «Активировать» , когда появится опция.

Шаг 2. Добавьте фрагменты кода в заголовок, нижний колонтитул и пост-инъекции

После установки плагина вы сможете перейти в «Настройки»> «Верхний и нижний колонтитулы» на панели инструментов.

Здесь вы найдете текстовый редактор для добавления фрагментов кода, таких как код отслеживания Google Analytics или пользовательский JavaScript, которые вы хотите включить в свой верхний и/или нижний колонтитул.

На этой странице вы можете многое сделать. В первых двух полях вы можете добавить код в раздел заголовка. Левое поле добавляет код на каждую страницу вашего сайта — это полезно, например, для Google Analytics. Правое поле добавит код только на вашу домашнюю страницу.

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

Улучшите работу своего сайта с помощью WP Engine

Без сомнения, вы хотите, чтобы ваш веб-сайт WordPress предоставлял вашим пользователям первоклассный цифровой опыт. Добавление кода в нижний колонтитул или заголовок WordPress — полезная тактика для настройки вашего сайта, внедрения Google Analytics или повышения производительности.

В WP Engine у ​​нас есть широкий спектр ресурсов для разработчиков, которые могут помочь вам вывести ваш сайт WordPress на новый уровень. Проверьте их сегодня!