Как добавить виджеты в Footer WordPress темы
Обязательно сохраните резервные копии файлов “functions.php” и “footer.php” на случай, если вы ошибётесь при изменении кода.
Добавление виджетов в современную тему
1. Регистрация виджета в области нижнего колонтитула-
Откройте файл functions.php в редакторе тем WordPress и с помощью поиска (Ctrl+F) найдите следующую строку кода:
register_sidebar
Это должно быть в районе, где зарегистрированы боковые колонки вашей темы.
Добавьте следующий код чуть ниже кода боковой панели (в примере идёт речь о регистрации трёх виджетов в нижнем колонтитуле):
register_sidebar( array( 'name' => 'Footer Sidebar 1', 'id' => 'footer-sidebar-1', 'description' => 'Appears in the footer area', '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' => 'Footer Sidebar 2', 'id' => 'footer-sidebar-2', 'description' => 'Appears in the footer area', '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' => 'Footer Sidebar 3', 'id' => 'footer-sidebar-3', 'description' => 'Appears in the footer area', 'before_widget' => '<aside id="%1$s" class="widget %2$s">', 'after_widget' => '</aside>', 'before_title' => '<h3 class="widget-title">', 'after_title' => '</h3>', ) );
На скриншоте файл functions.php темы “Twenty Twelve”, который должен дать вам некоторое представление о том, где нужно вставить блок кода.
2. Покажите виджет в области нижнего колонтитула вашей темы
Откройте файл footer.php и вставьте следующий блок кода там, где вы хотите показать виджеты (это покажет области 3 подвал виджета, если они имеют какие-либо виджеты в них:
<div id="footer-sidebar" class="secondary"> <div id="footer-sidebar1"> <?php if(is_active_sidebar('footer-sidebar-1')){ dynamic_sidebar('footer-sidebar-1'); } ?> </div> <div id="footer-sidebar2"> <?php if(is_active_sidebar('footer-sidebar-2')){ dynamic_sidebar('footer-sidebar-2'); } ?> </div> <div id="footer-sidebar3"> <?php if(is_active_sidebar('footer-sidebar-3')){ dynamic_sidebar('footer-sidebar-3'); } ?> </div> </div>
3. Настройте стиль виджета по своему вкусу
Добавьте следующий код в CSS файл style.css вашей темы, чтобы определить некоторые основные стили нижнего колонтитула и виджетов, которые только что добавили. Настройте их в соответствовии с вашим потребностями.
#footer-sidebar { display:block; height: 250px; } #footer-sidebar1 { float: left; width: 340px; margin-left:5px; margin-right:5px; } #footer-sidebar2 { float: left; width: 340px; margin-right:5px; } #footer-sidebar3 { float: left; width: 340px; }
Добавление нижних виджетов в старую тему
1. Регистрация сайдбара в WordPress теме
Перейдите в редактор тем WordPress и откройте файл Функций темы (functions.php). С помощью поиска найдите следующую строку:
if ( function_exists('register_sidebar') )
Как только вы найдете эту строку, то посмотрите на следующую строку, которая должна быть похожа на одну из следующих, в зависимости от того, сколько у вас сайдбаров:
register_sidebar(array(
или
register_sidebars(2,array(
Скажем, например, у вас есть один сайдбар в вашей теме, и вы хотите добавить ещё три дополнительных виджета в нижний колонтитул, необходимо внести изменение в коде:
register_sidebars(4,array(
>Регистрируем 4 сайдбара (тот, который у вас уже есть, и еще три, что вы собираетесь добавить в нижний колонтитул WordPress темы).
2. Вставьте сайдбары в тему WordPress
Теперь давайте вставим siderbars туда, где мы хотим их видеть в теме. В нашем случае мы собираемся вставить их в области нижнего колонтитула. Откройте файл Footer (footer.php) и вставьте следующий код прямо над секцией “footer”:
<div id="footer-sidebar" class="secondary"> <div id="footer-sidebar1"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(2) ) : ?> <?php endif; ?> </div> <div id="footer-sidebar2"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(3) ) : ?> <?php endif; ?> </div> <div id="footer-sidebar3"> <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(4) ) : ?> <?php endif; ?> </div> </div> <div style="clear-both"></div>
3. Добавьте стиль
Наконец, давайте добавим немного стилей для нижних виджетов, которые мы только что внедрили. Откройте файл стилей style.css и вставьте следующий код (вероятно, придется настроить CSS под ваши потребности в зависимости от WordPress темы, которую вы используете).
#footer-sidebar { display:block; height: 250px; } #footer-sidebar1 { float: left; width: 340px; margin-left:5px; margin-right:5px; } #footer-sidebar2 { float: left; width: 340px; margin-right:5px; } #footer-sidebar3 { float: left; width: 340px; }
Надеюсь это поможет! Теперь вам не нужно менять свю любимую тему WordPress только, чтобы получить нижние виджеты.
Источник
В поиске набрал “Как сделать виджеты в футере WordPress”, просмотрел кучу ресурсов, на которых совершенно разные инструкции, перепробовал все их, но получалась фигня какая то, а ваши коды повставлял и наконец то виджеты в футере отобразились как надо. Я только код CSS подправил чуток.
Спасибо большое за нормальную инструкцию!
Спасибо, было полезно. Только прилипают стили виджетов, которые тянутся с темы