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

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

Добавить новую область виджетов в WordPress

Добавлять области для виджетов в сайдбар будем в теме twentytwelve. Открываем файл functions.php, и на 234 строке находим комментарий с таким текстом: Register sidebars

Находим функцию:

function twentytwelve_widgets_init() {

    register_sidebar( array(
        'name' => __( 'Main Sidebar', 'twentytwelve' ),
        'id' => 'sidebar-1',
        'description' => __( 'Appears on posts and pages except the optional Front Page template, which has its own widgets', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );

...

Как видно в ней уже зарегистрированы сайдбары (области виджетов). Регистрируются они функцией

register_sidebar ();

В конец данной функции я добавил две своих области виджетов. В итоге весь блок function twentytwelve_widgets_init() { … } стал выглядеть следующим образом:

/* ------------------------------------------------------------------------------------------------------------------

    Создаю свои области для виджетов

------------------------------------------------------------------------------------------------------------------ */


function twentytwelve_widgets_init() {

    register_sidebar( array(
        'name' => __( 'Main Sidebar', 'twentytwelve' ),
        'id' => 'sidebar-1',
        'description' => __( 'Appears on posts and pages except the optional Front Page template, which has its own widgets', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );

    register_sidebar( array(
        'name' => __( 'First Front Page Widget Area', 'twentytwelve' ),
        'id' => 'sidebar-2',
        'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );

    register_sidebar( array(
        'name' => __( 'Second Front Page Widget Area', 'twentytwelve' ),
        'id' => 'sidebar-3',
        'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );



    // СВОИ ОБЛАСТИ ВИДЖЕТОВ

    register_sidebar( array(
        'name' => __( 'First my personal sidebar', 'twentytwelve' ),
        'id' => 'my-first',
        'description' => __( 'Appears on posts and pages except the optional Front Page template, which has its own widgets', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );

    register_sidebar( array(
        'name' => __( 'Second my personal sidebar', 'twentytwelve' ),
        'id' => 'my-second',
        'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'twentytwelve' ),
        'before_widget' => '<aside id="%1$s" class="widget %2$s">',
        'after_widget' => '</aside>',
        'before_title' => '<h3 class="widget-title">',
        'after_title' => '</h3>',
    ) );


}

Из кода выше можно увидеть что я зарегистрировал две своих области виджетов:

1) Область с именем «First my personal sidebar» и id «my-first»

2) Область с именем «Second my personal sidebar» и id «my-second»

Вывод кастомных областей виджетов в шаблоне wordpress

Теперь необходимо вывести в шаблоне созданные области виджетов.

Заходим в файл с шаблоном сайдбара — sidebar.php

И в конец файла вставляем код:

<?php if ( is_active_sidebar( 'my-first' ) ) : ?>

     <?php dynamic_sidebar( 'my-first' ); ?>

<?php endif; ?>

И вторую область виджетов я вставлю в шаблон sidebar-front.php

<?php if ( is_active_sidebar( 'my-second' ) ) : ?>

     <?php dynamic_sidebar( 'my-second' ); ?>

<?php endif; ?>

Теперь можно в админке WordPress наполнить созданные области виджетами и проверить их работу на сайте. Если все сделано правильно, все будет работать.