BuddyPress.org

I know I’m probably ahead of the curve here since it hasn’t been officially released yet, but does anyone have any pointers as to how to integrate an existing theme into BuddyPress 1.1?

Let’s say I have a specific WP theme I want to use on the main blog. Currently, if I have this active, my BP member pages go away. (I’m on one of the trunk version and could be behind.)

Do I generally have to just make a BP child theme that has the styles etc of the original WP theme?

The best option is to set “Template: bp-sn-parent” in the WP theme’s style.css header. That will allow it to inherit all of the BuddyPress templates.

If that isn’t an option (perhaps the theme is already a child theme) then you will need to copy over the template files from bp-sn-parent into the wp theme. Just make sure you don’t replace any existing theme files.

You’ll will probably want to add the user navigation into the theme also, you can add the following lines to the bottom of header.php:

<?php if ( !bp_is_blog_page() && !bp_is_directory() && !bp_is_register_page() && !bp_is_activation_page() ) : ?>
  <?php locate_template( array( 'userbar.php' ), true ) /* Load the user navigation */ ?>
  <?php locate_template( array( 'optionsbar.php' ), true ) /* Load the currently displayed object navigation */ ?>
<?php endif; ?>

Once you’ve done that, BuddyPress pages will inherit all of the theme’s styles and its header and footer. You will of course need to add extra styles since WP themes only handle blog pages.

You can also try importing the bp-sn-parent screen styles into the WP theme’s style.css file. Depending on the theme, this may help to add layout to BuddyPress pages, but also stay within the WP theme’s look and feel.

I prefer the other way around:

- The parent theme will be the original WP theme without modifications (or with light modifications in headers to add the BP navigation).

- The child theme will be the BP theme framework, but without the redundant files ( header, footer, archives, index, etc).

Why? Because some complex WP themes (specially frameworks) have a complex file structure, including internal PHP files with code that is loaded with something like:

load_template( TEMPLATEPATH . '/lib/theme_functions.php' );

TEMPLATEPATH points to the parent theme folder, which means that the included file won’t be found if the theme is a child theme.

If you use this setup, you won’t need to hack the WP theme.

Of course your BP theme will need to be modified to work, because it probably contains some load_template calls.

I tried this with the Thesis theme and it works really good.

Good call, I never considered doing it the other way around.

load_template() calls should be replaced with locate_template() calls that support child theme lookups.

Awesome, thanks. I’ll try both and see which one I like.

Although – for some themes one may be better than the other anyway. Hmmm.

Lots of meat to chew on here. Will let you know when I come up for air.

Here are a few screenshots of my integration (with a custom BP framework):

http://egraells.mirlo.cl/files/2009/09/bp-genealogies-preview-1.png
http://egraells.mirlo.cl/files/2009/09/bp-genealogies-preview-2.png
http://egraells.mirlo.cl/files/2009/09/bp-genealogies-preview-3.png

My custom framework initially was written from scratch, but since BP 1.1 I’ve borrowed a lot of code, styles and icons the bp-sn-parent

This is the case with many of the premium themes. Woo themes, for instance, use a custom framework to bootstrap everything. Fairly straightforward to edit the calls in functions.php, to point to the correct paths; but that’d have to be done each time the theme is updated. Not sure how frequently that happens in practice, though.

Detective’s way looks interesting, but it’s worth noting, perhaps, that it’s still a matter of hacking one thing or another–either the WP theme or the BP parent theme.

Nice work, though, Detective. I’m eager to see some really creative applications of BP, that break out of the default. With any luck, I’ll be able to do so myself.

@detective
Thanks, that the first explanation of working with a WP theme framework that actually made sense to me (I think I’m slow). I’ll be trying with Hybrid when WPMU 2.9 arrives. Doing it this way, I should be able to get most things done with child’s style.css and functions.php

Feel free to show us an example.

I’d really appreciate seeing the code for the corresponding files; I am mostly a n00b when it comes to his manner of hackery, and I would like to see what I am supposed to pick and choose. A step-by-step would be greatly appreciated.!

@alxjrvsgmailcom

This is about as detailed of a step-by-step set of instructions you will find. The rest is up to trial and error, and experience!

http://codex.buddypress.org/how-to-guides/upgrading-a-buddypress-1-0-theme-for-buddypress-1-1/

Hello,

I am using WooTheme’s Newsport on a WPMU 2.8.4a install with BuddyPress 1.1.1 (www.threesheetsnw.com).

I’d like to spend some time this weekend integrating BuddyPress 1.1.1 into my theme and was wondering if anyone had any more thoughts on the best approach.

Sepecifically, should I hack Newsport theme and add the Buddypress Templates (as recommended by BuddyPress) or …

Create a child theme, leaving Newsport alone, and including the BuddyPress templates in that child (as recommended by Detective above)?

I know that WooThemes use frameworks for its themes.

Thanks much for helping with this brave new world!

Marty

May I ask a possible dumb question? I’ve upgraded to 1.1.1 on 2.8.4a and am using a premium theme for my main blog. I’ve currently reverted back to the old BuddyPress theme system for now.

Here’s my question, can I leave my Premium Wordpress theme as the Parent theme, create a child, and place the bp-sn-parent folders and the “optionsbar.php”, “userbar.php” and “plugin-template.php” in the child theme? Also place header.php in the child with the appropriate code for the usernav bar? And then edit the appropriate css?

Is that a workable and effective approach?

Many thanks.

Could someone post such skeletal bp-in-between -framework to plugins or somewhere? One that:

- could easily be childed to any WP-theme
- is stripped from any non-bp elements? (header, footer etc.)
- load_template()s were replaced with locate_template()s
?

Or have I misunderstood something and this would be insensible?

@mmcomber
It appears from Detective’s post above yours that the path you described is being successful. I intend to do the same with Hybrid Theme when I get started.

It just occured to me, that detective’s way is the way the theme framework should be done. Here’s the deal:

1.0:
BP-Blog theme & BP-member theme. The blog theme was essentially any WP-blog theme (with minor tweaks), and the member theme contained the BP functionality. Both of them contained also their separate skins.

Theming was possible by taking excisting WP-themes and BP-themes and skinning them for consistent look. This approach had obvious disadvangages, but the advantage of being able to start from just about any WP-theme.

1.1.
WP-SN-Parent theme is essentially a WP-theme with BP-functionality. Theming is done by childing this theme. This solves issues about non-standard theme structure, but has the downside of having problems with integrating to other themes.

Enter Detective’s solution: in stead of two layers of BP default theme, we should have three:

1) BP-Structure theme (structure)
2) BP-Functional theme (pb-member theme etc. functionality)
3) Skin (CSS+js etc)

Each of these is the child theme of the upper.

Now, since BP-Functional is essentially an unskinned non-complete theme (no headers or footers etc.), it can and must be childed to any theme, not only to BP-Structure. Hence it would restore the 1.0 ability to start from any WP theme, and integrate BP into that. Still it would use the Child theme functionality and live nicely within the WP theme ecosystem.

For bp-theme authors this would mean improved flexibility: they could start by skinning (and maybe extending) the BP-Functional, or just the BP default skin. On the other hand, they could child the BP functional to some existing theme of theme framework – like Sandbox of Hybrid – and skin that.

And the best part is that it would be backwards compatible with the 1.1 framework: the bp-sn-parent is just split into generic structure part an the bp-specific function part, and skinned to the actual default part. And any theme extending (childing) the bp-default could still be extending (childing) it.

This kind of in-between theme is an interesting development in the design of WP-themes, kind of plugin in the theme architecture… Don’t know if it has been done before…

Could this make it into 1.2?