Виджеты - это очень хорошая штука, так как позволяют простым перетаскиванием добавлять/удалять блоки, менять их порядок в колонках Вашего блога. Благодаря виджетам Вы можете настроить свой блог абсолютно не разбираясь в php и html.
В принципе, многие авторы тем, распространяемых по GPL, уже давно сделали свои темы виджет-совместимыми. Но если вы скачивали тему давно, а новой версии ее автор не выпустил, то вполне возможно, что использование виджетов в ней не предусмотрено. Да и темы, созданные самостоятельно тоже часто не рассчитывались на использование виджетов, так как не было нужды или автор темы просто не знал о них.
К счастью, для решения этой проблемы не нужно писать горы кода. Очень часто, достаточно создать файл functions.php и прописать в него несколько строк.
Ниже я опишу как можно добавить поддержку виджетов в вашу тему, и как можно адаптировать их вид к вашей теме.
Если вы свободно понимаете английский язык, то возможно вам будет достаточно прочитать статью, которую я взял за основу для своей. Я же постараюсь описать процесс "виджетирования" темы с учетом своего опыта.
Итак, имеем тему, к которой мы хотим прикрутить поддержку виджетов. Вспомним, что виджеты - это блоки информации, которые показываются в колонках блогах (так как колонка не всегда одна). Значит нам нужно изменить шаблон, в котором происходит формирование колонок. Шаблон этот, как правило, находится в файле sidebar.php.
Для примера, я использую тему русифицированную версию тему Emire 1.0, взятую по адресу http://themes.mywordpress.ru/view/Emire. Вполне возмжно, что ее автор уже обновил ее, но мне важно, что данная версия не поддерживает виджеты и я попробую сделать ее виджет-совместимой самостоятельно.
Открываем файл sidebar.php и видим следующий код:
<div id="sidebar"> <h2>Рубрики</h2> <ul> <?php wp_list_cats('sort_column=name&optioncount=1&hierarchical=0'); ?> </ul> </ul> <h2>Архив</h2> <ul> <?php wp_get_archives('type=monthly'); ?> </ul> <ul> <?php get_links_list(); ?> </div>
Как видим, все что здесь прописано, это показ списка рубрик, архива и блока ссылок. Все это жестко вписано в шаблон, и, если нам захочется хотя бы поменять порядок блоков, или добавить другой блок, придется править этот файл.
Для того, чтобы в этой колонке отображались виджеты, когда они активированы, необходимо добавить все несколько строк кода:
<div id="sidebar"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?> //новая строка <h2>Рубрики</h2> <ul> <?php wp_list_cats('sort_column=name&optioncount=1&hierarchical=0'); ?> </ul> </ul> <h2>Архив</h2> <ul> <?php wp_get_archives('type=monthly'); ?> </ul> <ul> <?php get_links_list(); ?> <?php endif; ?> //новая строка </div>
В приведенном коде, комментариями я выделил добавленные строки. Таким образом мы подготовили наш шаблон колонки к показу виджетов.
Теперь нам нужно сообщить системе, что наша тема содержит одну колонку, на которой можно расположить виджеты. Для этого мы создаем файл functions.php (если его нет) и прописываем в него следующий код:
<?php if ( function_exists('register_sidebar') ) register_sidebar(); ?>
Таким образом, мы зарегистрировали одну колонку (по умолчанию). Теперь, зайдя на страницу управления виджетами (Внешний вид -> Виджеты) мы видим прямоугольник, подписанный как Сайдбар 1 (Sidebar 1). Перетянем на него какие-нибудь виджеты из доступных, нажмем на кнопку "Сохранить изменения" и - ура! - виджеты показались в колонке блога! 🙂 Правда выглядят не совсем так, как те, что были прописаны в шаблоне sidebar.php. Сейчас посмотрим что с этим можно сделать.
Давайте посмотрим на код, который генерируется после включения в нашу колонку виджетов:
<div id="sidebar"> <li id="search" class="widget widget_search"> <form id="searchform" action="xxxxxxxxxx" method="get"> <div> <input id="s" type="text" size="15" name="s"/> <br/> <input type="submit" value="Найти"/> </div> </form> </li> <li id="links" class="widget widget_links"> <h2 class="widgettitle">Ссылки</h2> <ul> <li> <a title="PHP4 и 5 хостинг, MySQL5.0" href="http://isahost.com">Наш хостинг</a> </li> </ul> </li> </div>
Как видим, виджеты генерируются внутри тэга li, то есть подразумевается, что вместо <div id="sidebar"> должно быть <ul id="sidebar">, но автор темы, увы использовал div. Значит нам нужно сделать так, чтобы при генерации виджетов они не вкладывались в тэг li. Наш замечательный WP это позволяет сделать без особых проблем:
Изменяем код, регистрации колонки в functions.php на следующий:
<?php if ( function_exists('register_sidebar') ) register_sidebar(array( 'before_widget' => '', 'after_widget' => '' )); ?>
Здесь мы просто задаем, что перед и после кода самого виджета ничего не будет вставляться. В результате получится код, аналогичный тому, что прописан в шаблоне колонки.
Таким образом мы подстраиваем вывод наших виджетов под существующий html-шаблон колонки. Но если вы только разрабатываете свою тему, то всегда имейте ввиду, что колонки лучше определять тэгом ul, так как стандартные виджеты, и большинство сторонних, по умолчанию, рассчитаны именно на это. И вам будет проще подстроить свою тему под виджеты, чем потом подстраивать вид виджетов под вашу тему. К тому же, ограничение тела виджета тэгом li дает большую гибкость при определении стилей для виджетов.
Возможно, что для некоторых виджетов вам придется дополнительно задать стили в CSS файле, например, для форм или каких-то других вложенных тэгов.
В случае, если ваша тема содержит больше чем одно колонки, вам необходимо при регистрации колонок использовать вместо функции register_sidebar функцию register_sidebars(n). Например, для двух колонок код будет такой:
<?php if ( function_exists('register_sidebars') ) register_sidebars(2); ?>
или
<?php if ( function_exists('register_sidebars') ) register_sidebars(2, array( 'before_widget' => '', 'after_widget' => '' )); ?>
И в шаблоне sidebar.php при вызове функции dynamic_sidebar() в качестве параметра передаете номер колонки (начиная с 1).
Вот, собственно, и все.
Спасибо за статью сайту - a2p.net.ru