Иногда бывает нужно добавить баннеры или что-то другое выше хедера сайта или в самом конце страницы, ниже футера. Смотрим, как это сделать.
Делается это в два простых шага.
1. В function.php добавляем следующий код. Можно заменить themename на название использумой темы, но, по идее, может сработать и так:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
//* Register widget areas genesis_register_sidebar( array( 'id' => 'before-header', 'name' => __( 'Before Header', 'themename' ), 'description' => __( 'This is the before header widget area.', 'themename' ), ) ); genesis_register_sidebar( array( 'id' => 'after-footer', 'name' => __( 'After Footer', 'themename' ), 'description' => __( 'This is the after footer section.', 'themename' ), ) ); //* Hook before header widget area above header add_action( 'genesis_before', 'themename_before_header' ); function themename_before_header() { genesis_widget_area( 'before-header', array( 'before' => ' ', 'after' => ' ) ); } //* Hook after footer widget area below footer add_action( 'genesis_after', 'themename_after_footer' ); function themename_after_footer() { genesis_widget_area( 'after-footer', array( 'before' => ', ' ) ); } |
2. Оформим эти новые виджеты чуть покрасивее. Для этого добавляем следующий код в style.css:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
/* Before Header and After Footer Widgets ---------------------------------------------------------------------------------------------------- */ .before-header, .after-footer { line-height: 1; padding: 0 5%; text-align: center; } .before-header .wrap, .after-footer .wrap { border-bottom: 1px dotted #ddd; padding: 20px 0; } .before-header p, .after-footer p { line-height: 1.625; } .before-header p:last-child, .after-footer p:last-child { margin-bottom: 0; } |
Все, теперь у нас на странице «Виджеты» появилось два новых виджета.
Если будете вставлять туда рекламу — удостоверьтесь, что код поддерживает мобильные версии.