Как сделать тему WordPress виджет совместимой за 3 шага

В комментариях к последней статье «Виджеты — это очень просто!» попросили рассказать, как же сделать тему виджет совместимой. Честно говоря, я думал, что на офф.сайте это описано, а как выяснилось написано то оно написано, да не совсем там.

В общем, отрыл я пошаговое описание того, как нужно «грамотно» виджетизировать свою тему, которое ниже предлагаю вам в своём переводе с небольшими корректировками и дополнениями.


Шаг 1. Редактируем functions.php

Сперва необходимо удостоверится в том, что в папке с вашей темой находится файл function.php, а если таковой отсутствует, то создайте его сами.
Следующим шагом нам необходимо определиться — как у нас формируется сайдбар. Откройте свой sidebar.php и попытайтесь вникнуть в код и понять, что используется для формирования сайдбара — списки (<ul>) или дивы (<div>).
Например, у Артема сайдбар стандартный, из списков и заголовков второго уровня, что видно по коду:

А вот у Максима напротив, сайдбар состоит из последовательных блоков div, обрамленных изображениями «скругленных углов», а уже внутри дива находится контент виджета. Кусок кода, чтобы было (возможно) проще понять, о чём я говорю:

Так вот — первый вариант, как я уже и писал, можно обозвать стандартным или скорее классическим, а следовательно и встраивание в сайдбар по «классической схеме» будет проходить максимально безболезненно.

Достаточно в functions.php добавить блок кода, чтобы в итоге получить сайдбар на основе списков с заголовками 2 уровня:

Если файл functions.php вы не создавали с нуля, то советую сперва просмотреть его на наличие указанного выше кода, чтобы не получилось дублирования.

Если же, вы используете, какой-то более извращенный метод (ничего личного, Макс:-)), то код может принять устрашающий вид, аля:

Дам небольшие пояснения, строка, передаваемая в параметр ‘before_widget’ будет выводится как начало любого виджета, а ‘after_widget’ — конец. Т.е. тут мы задаём тэги обрамления виджета. ‘before_title’ и ‘after_title’ соответственно определяют обрамление заголовка виджета (это все те «Рубрики» и «Самое читаемое»). В итоге мы получим дивный сайдбар с заголовками 4 уровня.

Для особо замороченных существует возможность получить при выводе виджета его id (генерится из имени виджета) и класс (получается в процессе обработки виджета). Т.к. ‘before_widget’ пропускается через sprintf, то в любое место строки можно передать %1$s и %2$s, чтобы при выводе получить соответствующие параметры. Надеюсь «замороченные» поняли, о чём я.

Шаг 2. Проверяем сайдбар и добавляем на него виджеты

Чтобы понять работает наш сайдбар или нет, нужно добавить на него несколько виджетов.
Идём в админ панель, далее «Внешний вид > Виджеты» и лицезреем (или нет, если забыли сохранить и/или загрузить functions.php в свою тему) панель сайдбара, куда можно (и даже нужно) натаскать пару-тройку виджетов. И главное нажать «Сохранить», после чего перейти к третьему шагу.

Шаг 3. Добавление сайдбара в шаблон

Ну и наконец-то то, ради чего всё делалось — подключение сайдбара в шаблон.
Тут есть простой и очень простой способ. Оба заключаются в редактировании файла sidebar.php вашей темы.
Простой способ:
Вставить сразу после строки <div id=»sidebar»> следущий код

а перед последним </div> код — <?php endif; ?>
Очень простой способ заключается в том, чтобы понять для себя раз и навсегда, что никто уже не использует шаблоны без виджетов и, стерев предварительно ВЕСЬ код из sidebar.php, скопипастить туда:

Чем меньше кода в подключаемом файле, тем быстрее у нас всё работает (хотя на таком уровне это конечно «мёртвому припарки», но всё же).

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


Если что-то не получилось, то пишите в комментарии о проблемах, с которыми пришлось столкнуться, возможно, ответы будут полезны и другим.

И ещё, я думаю — писать пост про создание темы с несколькими виджетами или нет? Пригодится тебе такая статья, читатель, или нет?

Как сделать тему WordPress виджет совместимой за 3 шага: 10 комментариев

  1. Тарас, у меня не виджетный сайдбар. Определены две реременный для вывода, которые содержат html для верха и ниха блока.

    так что получается еще проще.

    <?=$round_box_top?>
    любой код
    <?=$round_box_bottom?>

    И никаких изврящений 😉

  2. О, виджеты, проклятье для wordpress-шаблонов. Люди пихают тонны текста в сайдбар, вставляют архивы записей в виде календаря, дублируют поиск несколько раз, а потом удивляются, что всё выглядит не очень красиво и строчат злобные письма. 🙂

  3. Ятолько думаю ставиить WP,накомп поставила тема default при чтении одной статьи полностью,убирает правый столбец
    У Вас имеется
    А как Вы это сделали?

    Мне потом еще гамму поменять надо и шапку

  4. интересно, это только я избавляюсь от виджетов в любой используемой теме? как нормально настроить отделельный виджет через тот же css я не понимаю, мне куда проще php код вставить.

  5. Все это понятно и хорошо. Тема нормальная, но я думаю будет здесь людям и интересно как прописывать например : последние 10 комментариев, 10 последних постов и т.д.

  6. Уведомление: Отчёт о результатах переезда на WordPress 2.6 | Блог о WordPress от Тараса

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