BuddyPress

We are trying to integrate buddypress within a beautiful non-buddypress theme [Amplifier] and are experiencing some problems with the alignment of the elements on the buddypress pages within the theme.

We have installed the BuddyPress Template Pack plugin. We followed the steps and tried to change the html structure as such that the theme should work, but it seems that the custom sidebar functionality is causing some sort of problem for this. On the buddypress pages we just can’t seem to get it working within the boundaries of the theme. Or maybe we are doing something wrong…

We can’t figure out what this problem is and how to solve it.

It requires a either some changes to a theme as stated here (http://codex.buddypress.org/theme-development/wordpress-to-buddypress-theme/) or a theme can be converted to a buddypress child theme as stated here (http://codex.buddypress.org/theme-development/building-a-buddypress-child-theme/).

The code for our theme:

PasteBin:
sidebar.php: http://pastebin.com/LtaAKJWF
page.php: http://pastebin.com/ygE3NTkB
index.php: http://pastebin.com/HsXML9DK
header.php: http://pastebin.com/VEmtX43g
footer.php: http://pastebin.com/6riqHF48

Our question is:
Does anybody of you know how to solve our problem?
We would be eternally grateful!!!

Best and thanks in advance,
Johan

First of all, if you’ve made any revisions in any of BP template files transferred to your amplifier theme folder in your server, I recommend that you delete the 6 BP template folders and re-run Appearance > BP Compatibility so that new and clean BP template files will be transferred to your amplier theme folder.

Scan of source code reveals that you can use the second method to make your theme compatible with BuddyPress i.e. only create header-buddypress.php and sidebar-buddypress.php files, instead of revising 16 BP template files. With this set-up however, you can only have a right sidebar as I have deleted the option in the template so that layout won’t break.

Make a copy of your theme’s header.php and save it as header-buddypress.php
Open up header-buddypress.php and add the following at the very bottom of the file below all other code

<?php get_header(); ?>
<div class="container_12" id="body-wrap" role="main">
<div id="breadcrumb-wrap" class="grid_12 breadcrumbs">
	<?php if(function_exists('bcn_display')) {  bcn_display(); } ?>
</div> <!-- end #breadcrumb-wrap .grid_12 -->
<div id="post-content-wrap" class="grid_8 suffix_1 single-post">
	<div <?php post_class() ?> id="post-<?php the_ID(); ?>">

[Part 2]

Create a new empty file and name it sidebar-buddypress.php
Open up empty sidebar-buddypress.php and add the following

</div>
</div>
<div id="sidebar" class="grid_4">
	<div id="primary" class="widget-area" role="complementary">
		<ul class="xoxo">
			<?php if ( is_active_sidebar( 'general-widgets' ) ) : // check if there are widgets in the 'genderal widgets' sidebar ?>
			<?php dynamic_sidebar( 'general-widgets' ); // display 'general widgets' ?>
			<?php else : // if no 'general widgets' do nada  ?>
			<?php endif; // end 'general widgets' check ?>
		</ul>
	</div>
</div>
<?php if ( bp_is_register_page() ) : ?>
	<script type="text/javascript">
		jQuery(document).ready( function() {
			if ( jQuery('div#blog-details').length && !jQuery('div#blog-details').hasClass('show') )
				jQuery('div#blog-details').toggle();
			jQuery( 'input#signup_with_blog' ).click( function() {
				jQuery('div#blog-details').fadeOut().toggle();
			});
		});
	</script>
<?php endif; ?>
</div>
<div class="clearfix"></div>

Save file.

Upload two new files created to amplifier theme folder in server.

This helped a lot!
Thanks for your great help!

I did change:
<div id="post-content-wrap" class="grid_8 suffix_1 single-post">
in
<div id="post-content-wrap" class="grid_8 single-post">

and
<div id="sidebar" class="grid_4">
in
<div id="sidebar" class="grid_4 right">

That worked with sidebar on the right; for almost all of the pages! Yeah!

The only pages that do not work yet are:
- Activity
- Group Forum

They are both still full width pushing the sidebar underneath again. Seems that when the text overflows, the sidebar is pushed down.

And the area in which buddypress ‘is active’ also becomes smaller when the menu options are less, making the menubar narrower and all active buddypress space underneath as well. They are linked to each other now it seems.

Do you know how to have this fixed at grid_8 so that activity and forum stay in, and when menu is narrowe it aligns to grid_8?

Thanks again for your help. You’re a lifesaver!