By 4 steps I make the menu at top in bbPress forum pages
1. Create a Widget Area.
2. Create a Menu for bbPress forum
3. Place the widget area by Hook
4. Style the Menu
1. Creating a Widget Area
Add the php code in functions.php file
|
1 2 3 4 5 |
genesis_register_sidebar( array( 'id' => 'forum-menu', 'name' => __( 'Forum Menu Widget', 'busitech' ), 'description' => __( 'This widget area is for forum menu.', 'busitech' ), ) ); |
2. Creating a Menu for bbPress forum.
Create a Menu (Appearance->Menus) from wordpress menu page. Now drag & drop the custom menu widget in this new widget area from Appearance->Widgets page.
3. Placing the new Forum Menu Widget area by Hook
Call genesis_entry_header hook and displaying Forum Menu Widget area using conditional tag. Add the code in your functions.php file
|
1 2 3 4 5 6 7 8 9 10 |
//* bbPress if( function_exists('is_bbpress') ): add_action('genesis_entry_header', 'forum_menu', 6); function forum_menu(){ if ( !is_admin() && ( in_array( get_post_type(), array('forum', 'topic', 'reply') ) || bbp_is_search_results() || bbp_is_single_user() ) ){ genesis_widget_area( 'forum-menu', array('before' => '<div class="forum-menu forum-menu-section">','after'=> '</div>') ); } } endif; |
4. Styling the Menu
Lastly I add the CSS and setup the design as per my site design.
|
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 |
.forum-menu-section { background: #f2f2f2; margin: -32px -32px 30px; padding: 8px 32px; } .forum-menu-section .menu a:hover, .forum-menu-section .menu .current-menu-item > a { background: #61b0d1; color: #fff; } .forum-menu-section .menu { clear: both; font-family: Montserrat; font-size: 15px; line-height: 1; width: 100%; } .forum-menu-section .menu-item { display: inline-block; text-align: left; } .forum-menu-section .menu a { color: #333; display: block; padding: 15px 24px; } |
Leave a Reply