Add Forum Menu in bbPress like Studiopress Forum

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

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

//* 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.

.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;
}
This site uses cookies to offer you a better browsing experience. By browsing this website, you agree to our use of cookies.