Главная Новости

Wordpress. Как добавить в шаблон собственную область для вывода виджетов

Опубликовано: 12.04.2018

видео Wordpress. Как добавить в шаблон собственную область для вывода виджетов

HTML2WP. Серия #4. Подвал. Добавляем настройки и виджеты

Виджеты в Wordpress позволяют из административной панели самостоятельно наполнять определенные области различными элементами.


Как создавать и выводить области для виджетов в Wordpress

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

Иногда хочется добавить в существующий шаблон собственную область виджетов и WordPress предоставляет для этого простые и удобные инструменты.

Рассмотрим добавление области виджетов в тему на простом примере. Добавим в шапку сайта форму для поиска по сайту. В шаблоне Twenty seventeen предусмотрены области для вставки виджетов в основную область контента, 2 области под основной и сайдбар. Но области для хедера нет. Добавим её сами.

Для этого потребуется выполнить 3 шага:

зарегистрировать новую область виджетов в файле function.php; наполнить ее информацией в панели управления; сделать вывод области в вашем шаблоне.

Регистрация области виджетов производится специальной функцией register_sidebar.

function twentyseventeen_widgets_init() { register_sidebar( array( 'name' => __( 'Sidebar', 'twentyseventeen' ), 'id' => 'sidebar-1', 'description' => __( 'Add widgets here to appear in your sidebar.', 'twentyseventeen' ), 'before_widget' => '<section id="%1$s" class="widget %2$s">', 'after_widget' => '</section>', 'before_title' => '<h6 class="widget-title">', 'after_title' => '</h6>', ) ); ... register_sidebar( array( 'name' => __( 'Шапка.справа', '' ), 'id' => 'top-area', 'description' => __( 'Шапка', '' ), 'before_widget' => '', 'after_widget' => '', 'before_title' => '<h3>', 'after_title' => '</h3>', ) ); }

Основные параметры здесь означают:

name — заголовок виджета; description — описание; id — идентификатор.

Сохраняем файл. Заходим в админ панель «Внешний вид — Виджеты». Видим, что там появилась новая область, которая на рисунке выделена зелёной рамкой. Видим, что ее заголовок и описание как соответствуют нашим.

rss