Прежде всего давайте уточним несколько общих моментов про сайдбары:
В обоих случаях предназначение у сайдбаров одинаковое — навигация по сайту, ссылки на социальные сети, виджеты соц сетей, виджеты каких-либо сторонних сервисов (например поиск авиабилетов) и т.д.
Единственное отличие определения сайдбара в WordPress это то, что он может находится где угодно на странице сайта (но чаще всего это боковые колонки справа и слева от контента и футер).
В этом шагу мы рассмотрим пошагово как создать два сайдбара — один в боковой колонке и один в подвале (футере) сайта.
Шаг 1. Регистрация сайдбара
Для начала скажу, что в разных темах WordPress сайдбары регистрируются по-разному, в некоторых ещё до сих пор используется способ 2007-го года. Почему? Да просто некоторые липовые разработчики любят неосознанно копировать код из других тем, их даже не волнует, что тема, которую они используют в качестве своего «на все случаи» шаблона, не обновлялась более 5 лет.
Это я к тому, что код, который я дам вам сегодня может отличаться от кода, используемого в вашей теме — пусть это не станет поводом для волнений, просто замените старый код на новый.
Как я уже говорил, мы будем создавать два сайдбара — в боковой колонке и в футере, в этом нам поможет функция register_sidebar() (если что-то будет непонятно в коде — смотрите документацию функции). Хук widgets_init обязателен!
Код для файла functions.php
:
function true_register_wp_sidebars() { /* В боковой колонке - первый сайдбар */ register_sidebar( array( 'id' => 'true_side', // уникальный id 'name' => 'Боковая колонка', // название сайдбара 'description' => 'Перетащите сюда виджеты, чтобы добавить их в сайдбар.', // описание 'before_widget' => '<div id="%1$s" class="side widget %2$s">', // по умолчанию виджеты выводятся <li>-списком 'after_widget' => '</div>', 'before_title' => '<h3 class="widget-title">', // по умолчанию заголовки виджетов в <h2> 'after_title' => '</h3>' ) ); /* В подвале - второй сайдбар */ register_sidebar( array( 'id' => 'true_foot', 'name' => 'Футер', 'description' => 'Перетащите сюда виджеты, чтобы добавить их в футер.', 'before_widget' => '<div id="%1$s" class="foot widget %2$s">', 'after_widget' => '</div>', 'before_title' => '<h3 class="widget-title">', 'after_title' => '</h3>' ) ); } add_action( 'widgets_init', 'true_register_wp_sidebars' );
Вот что получилось у меня на странице Внешний вид > Виджеты:
Уже сейчас вы можете добавлять и настраивать виджеты в сайдбарах, теперь осталось только вывести их на сайте.
Шаг 2. Как отобразить сайдбары на страницах сайта?
Как и в случае из первого шага, в разных темах вы можете найти разный код, отвечающий за вывод сайдбаров на сайте. Я рассмотрю только один способ, который использую сам, с использованием функций is_active_sidebar() и dynamic_sidebar().
В двух словах о том, для чего нужны эти функции:
Давайте теперь выведем те два сайдбара, которые мы создавали в прошлом шаге. И начнем с боковой колонки:
<?php if ( is_active_sidebar( 'true_side' ) ) : ?> <div id="true-side" class="sidebar"> <?php dynamic_sidebar( 'true_side' ); ?> </div> <?php endif; ?>
Куда вставлять код? Ну где хотите вывести сайдбары, туда и вставляйте. Не уверены в какой файл? Ну, вообще это полностью зависит от вашей темы, но вероятнее всего, что код боковой колонки вставлять в sidebar.php
, а код футера в footer.php
. Возможно вам ещё пригодится документация функций get_sidebar() и get_footer().
Футер:
<?php if ( is_active_sidebar( 'true_foot' ) ) : ?> <div id="true-foot" class="sidebar"> <?php dynamic_sidebar( 'true_foot' ); ?> </div> <?php endif; ?>
Ещё несколько советов относительно сайдбаров
Каждый из нижеперечисленных советов поможет избежать весьма серьёзных багов на сайте, однако, если вы хорошо разбираетесь в PHP и WordPress, ничего нового из этих советов вы не узнаете.
if ( is_active_sidebar( 'true_foot' ) ) : dynamic_sidebar( 'true_foot' ); else : // код по умолчанию на случай, если сайдбар пустой endif;
Если у вас возникнет какой-либо вопрос относительно сайдбаров в WordPress, пожалуйста, оставьте его в комментариях, я постараюсь вам помочь с ним разобраться.
Как отключить сайдбар в WordPress?
Могу предложить вам пару вариантов решения этой задачи: