Как добавить область виджета в footer.php

Как добавить виджет в footer Wordpress Wordpress

Тема WordPress по умолчанию — Twenty Fifteen с фиксированной боковой панелью слева, которая превращается в верхний колонтитул в мобильном представлении, минимальной областью нижнего колонтитула, отличной графикой и красивой областью изображения.

Тема замечательная, однако мы понимаем, что пользователи хотят настроить ее и сделать это самостоятельно. Эта тема предлагает только одну боковую панель, которая в WordPress называется областью готовности к виджетам. Я покажу вам, как в WordPress добавить виджет в подвал сайта (footer.php). Добавление области виджетов в нижний колонтитул Twenty Fifteen ничем не отличается от добавления области виджетов в большинстве тем WordPress.

Нижний колонтитул виджета WordPress и другие позиции

Создать дочернюю тему WordPress

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

# 1 Шаг: Создать каталог и файлы дочерней темы

В качестве первого шага создайте папку внутри папки wp-content> themes. Назовите папку «Twenty Fifteen Child», или дайте другое название — как хотите.

Необходимым файлом для работы дочерней темы является style.css. Желаемый файл — functions.php. Эти два файла должны находятся в созданной папке дочерней темы.

# 2 Шаг: Добавьте файл для области виджета нижнего колонтитула WordPress

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

В нашем случае возьмем (скопируем) footer.php из темы Twenty Fifteen и вставим его в нашу дочернюю тему.

# 3 Шаг: Добавьте код в файлы дочерней темы, чтобы в WordPress добавить виджет

Дочерняя тема ничего особого не делает. Работающая дочерняя тема нуждается в комментариях вверху файла style.css. Откройте style.css в вашем любимом редакторе кода и добавьте этот кусочек кода.

Важной частью здесь является Template: twentyfifteen, которая сообщает WordPress имя родительской темы. Убедитесь, что имя совпадает с именем папки родительской темы — регистр букв или любые пробелы, тире, подчеркивания и т.д. Важно: всё должно точно соответствовать имени папки родительской темы.

Затем откройте файл functions.php и добавьте этот фрагмент кода.

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

Функция, которая подключается к обработчику действий wp_enqueue_scripts ( ). Внутри функции мы подключаем таблицу стилей родительской темы с помощью функции wp_enqueue_style ( ). Это гарантирует, что дочерняя тема наследует стили своего родителя, переопределяя любое конкретное правило стиля в своем собственном файле style.css.

Наша дочерняя тема в основном закончена!

Откройте панель «Темы» в своей установке WordPress, и вы увидите готовую к использованию тему «Twenty Fifteen Child». Нажмите активировать и посетите ваш сайт. Он должен выглядеть точно так же, как и родительская тема.

Добавление области виджетов

Теперь нам нужно добавить код для определения области виджета нижнего колонтитула. Вот фрагмент, который входит в functions.php.

Приведенный выше код добавляет функцию, которая регистрирует боковую панель с идентификатором sidebar-2, а затем подключает эту функцию к хуку действий widgets_init ( ) Тема Twenty Fifteen уже имеет боковую панель с идентификатором sidebar-1.

Теперь давайте добавим только что созданную боковую панель в нижний колонтитул. Открываем footer.php в редакторе кода и введите этот фрагмент чуть ниже этой строки кода: < footer id="colophon" class="site-footer" role="contentinfo">.

Приведенный выше код сначала проверяет, есть ли в sidebar-2 какие-либо виджеты, если это так, он отображает боковую панель внутри div с классом области виджетов. Следующее, что вам нужно сделать, это зайти на панель «Виджеты» вашего бэкэнда WordPress, найти боковую панель «Виджеты нижнего колонтитула» и добавить к ней некоторые виджеты. Сохраните виджеты по мере их добавления и проверьте результат.

В некоторых случаях вы можете увидеть, что текст слишком близко к верхней части контейнера, а нижнее поле виджетов слишком высокое. Этот небольшой фрагмент в style.css значительно улучшит внешний вид.

Ваш виджет нижнего колонтитула WordPress готов!

В этом посте мы увидели, как добавить новую область виджетов в footer.php WordPress темы Twenty Fifteen. Хотя мы поместили область виджетов в нижний колонтитул темы, но вы можете добавить области виджетов практически везде в теме, выполнив аналогичные шаги.

Оцените статью
Добавить комментарий