Codex Home → BuddyPress Theme Development → BP Theme Compatibility and the WordPress Default Themes → Twenty Eleven Theme

Twenty Eleven Theme

A. One Column Layout

This is the default page layout of the Twenty Eleven theme. There’s no need to do anything else if this is the layout you prefer for all your BuddyPress pages.

B. Full-width page

If you prefer to have a full-width layout for all your BuddyPress pages, follow the steps laid out below.

1. Create a child theme of the Twenty Eleven theme.

2. Create a new file in your new child theme folder and name it buddypress.php.

3. Copy over the content of Twenty Eleven’s onecolumn-page.php file into the new buddypress.php file

<?php
/**
 * BuddyPress: Full Width Template
 *
 * Description: A Full Width Page Template
 *
 * @ since Twenty Eleven 1.7 and BuddyPress 1.9 beta 1
 */
get_header(); ?>

		<div id="primary">
			<div id="content" role="main">
				<?php while ( have_posts() ) : the_post(); ?>
					<?php get_template_part( 'content', 'page' ); ?>
				<?php endwhile; // end of the loop. ?>
			</div><!-- #content -->
		</div><!-- #primary -->

<?php get_footer(); ?>

5. Open up your child theme’s style.css file and add the following and save file.

.buddypress .entry-header, 
.buddypress .entry-content, 
.buddypress footer.entry-meta {
	margin: 0 auto !important;
	width: 100% !important;
}

6. Upload your Twenty Eleven child theme folder to server.

C. Two Column, Right Sidebar Layout

If you prefer to have a two column layout for all your BuddyPress pages, follow the steps below.

1. Create a child theme of the Twenty Eleven theme.

2. Create a new file in your new child theme folder and name it buddypress.php.

3. Copy over the content of Twenty Eleven’ theme’s sidebar-page.php file into the new buddypress.php file.

<?php
/**
 * BuddyPress: Right Sidebar Template
 *
 * A page Template that adds a sidebar to all BP pages.
 *
 * @ since Twenty Eleven 1.7 and BuddyPress 1.9 beta 1
 */
get_header(); ?>

		<div id="primary">
			<div id="content" role="main">
				<?php while ( have_posts() ) : the_post(); ?>
					<?php get_template_part( 'content', 'page' ); ?>
				<?php endwhile; // end of the loop. ?>
			</div><!-- #content -->
		</div><!-- #primary -->

<?php get_sidebar('buddypress'); ?>
<?php get_footer(); ?>

4. Create a functions.php file in the folder of your child theme if you don’t have one yet. You will need to remove the .singular body class generated via Twenty Eleven theme’s functions.php file for the regular pages, which is designed as a one column layout. Otherwise, the sidebar you will be adding will fall down below the BuddyPress content.

5. Add the following to your new functions.php file then save file.

<?php
// Remove singular body class in BuddyPress pages
function mme_remove_singular_body_class($wp_classes) {
	if( function_exists ( 'bp_loaded' ) && !bp_is_blog_page() ) :
		foreach($wp_classes as $key => $value) {
			 if ($value == 'singular') unset($wp_classes[$key]);
		}
	endif;
	return $wp_classes;
}
add_filter('body_class', 'mme_remove_singular_body_class', 20, 2);

6. Upload your Twenty Eleven child theme folder to server.

---