A. One Column Layout 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 B. Full-width page
Full-width Layout. Click on image to enlarge.
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
[sourcecode lang=”php”]
<?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(); ?>
[/sourcecode]
5. Open up your child theme’s style.css file and add the following and save file.
[sourcecode lang=”css”]
.buddypress .entry-header,
.buddypress .entry-content,
.buddypress footer.entry-meta {
margin: 0 auto !important;
width: 100% !important;
}
[/sourcecode]
6. Upload your Twenty Eleven child theme folder to server.
C. Two Column, Right Sidebar Layout C. Two Column, Right Sidebar Layout
Two-column Layout. Click on image to enlarge.
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.
[sourcecode lang=”php”]
<?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(); ?>
[/sourcecode]
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.
[sourcecode lang=”php”]
<?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);
[/sourcecode]
6. Upload your Twenty Eleven child theme folder to server.