Наверх

Как добавить сайдбар в шаблон WordPress?

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

Рассмотрим технологию добавления дополнительного сайдбара в тему wordpress.

Сначала перейдите в консоли в раздел Внешний вид -> Редактор, откройте файл functions.php, найдите запись

<?php
if ( function_exists('register_sidebar') )
register_sidebar();
?>

и добавите в него следующие строки:

if ( function_exists('register_sidebar') )
register_sidebar(array(
'name' => 'Дополнительная колонка',
'before_widget' => '<li>',
'after_widget' => '</li>',
'before_title' => '<h2>',
'after_title' => '</h2>',
));

Здесь name - это имя сайдбара. Параметры before_widget и after_widget определяют тэги, в которые помещается каждый виджет сайдбаре. Параметры before_title и after_title позволяют задать обрамляющие теги для заголовков виджетов в сайдбаре.

После добавления этого кода в разделе Внешний вид -> Виджеты должен появиться новый сайдбар. На него можно добавлять виджеты.

Добавим вывод этого сайдбара в шаблоне темы.

Способ 1. Прямое включение в шаблон главной страницы.

В разделе Внешний вид -> Редактор находим там нужный шаблон страницы (например index.php) и там, где должен показываться сайдбар, добавляем строки:

<div>
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Дополнительная колонка') ) : ?> <?php endif; ?>
</div>

Способ 2. Более корректный

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

<div>
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Дополнительная колонка') ) : ?> <?php endif; ?>
</div>

Также сюда можно добавить декоративные элементы и теги оформления колонки.

В месте, где нужно вывести сайдбар, добавляем:

<?php get_sidebar("second"); ?>

Согласно документации параметром этой функции является вторая часть имени файла с кодом сайдбара.

После этих манипуляций сайдбар появится в указанном вами месте. Отредактируйте стили в style.css для корректного отображения.


Источники:
http://цмс-вордпресс.рф
http://phpdoc.wordpress.org

Всего отзывов: 7

  1. Ребят мне нужно добавить обычный див с картинкой и подключить к нему стили ксс я знаю как это сделать в html, будет ли это отличается в WP?

    • Ярослав, сам код html отличаться не будет. Вам нужно будет отредактировать тот фрагмент шаблона, куда вы хотите вставить блок (Панель администратора -> Внешний вид -> Редактор). После этого нужные стили добавьте там же в файл style.css

  2. Сайт поддерживает виджеты точно. В файле sidebar есть такой участок:

    Это говорит о том, что он динамический?
    Меня смущает кусок кода в конце:

    Может в этом дело?

  3. Антон, думаю стоит проверить, подключены ли у вас вообще динамические sidebarы, или же по умолчанию включен статический, а также поддерживает ли ваша тема виджеты, добавив что нибудь в уже существующий sidebar.
    Затем по первому способу еще раз попробовать добавить сайдбар, не забыть в виджетах добавить в него какую-нибудь информацию, которая точно существует (облако меток, календарь).
    При этом надо контролировать id этих блоков, иначе с неправильным id работать ничего не будет.

  4. Здравствуйте! Мне не помог не первый, не второй способ( В виджетах я «дополнительную колонку» вижу, а на самом сайте она не отображается. Подскажите, что еще можно поковырять?

  5. Описание функции get_sidebar():

    Подключает файл шаблона sidebar.php (сайдбар). Если передан параметр $name, то будет подключен файл sidebar-{name}.php.
    Если файл не найден в шаблоне темы, то будет взять файл по умолчанию: wp-includes/theme-compat/sidebar.php

    То есть следует проверить, как называется файл, в который выносится код. Если вы назвали файл sidebar-left, то в месте вставки надо писать:
    < ?php get_sidebar( "left" ); ?>

  6. Что-то вот это не понятно
    Если не выношу в отдельные файлы, то работает, если выношу, то не работает.

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

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