Convert a WordPress Theme to a BuddyPress Theme
-
Wondering if anyone can clearly articulate how to take an existing WordPress theme and convert it to a BuddyPress enabled theme for 1.2?
Andy has provided a good overview of how to Build a BuddyPress child theme from the new parent, but what about if you want to take a theme like P2 or a premium magazine theme and have it BuddyPress enabled?
If I’m missing something let me know.
Cheers
-
It’s actually quite easy with BuddyPress 1.2, just requires cutting some stuff from the default BuddyPress child template functions, adding them to your own theme functions & some CSS edits.
I will be happy to post a howto once BuddyPress 1.2 comes out of beta if it helps.
http://www.bp-tricks.com/design/member-blog-themes-to-match-your-buddypress-theme/
This is pretty old, since 1.2 doesn’t have wire anymore, but it’s almost the same.
That’s the exact opposite of what he needs though.
Woops, wasn’t reading correctly. Well work the other way around then.
Add the files that your theme doesn’t have and start using bp functions.
thekmen and I have done this with Hybrid as the parent theme and our own child theme built on a Hybrid Child theme and Buddypress. Have a look at http://themehybrid.com/community/topic/hybrid-and-buddypress for the functions that need to move over at least for Hybrid. It was actually quite easy. My post at http://themehybrid.com/community/topic/hybrid-and-buddypress#post-2506 is as close to a step by step as I’ve seen. However, there are still more CSS tweaks needed after following those steps.
@odyssey ~ thanks for the nice writeup – one other step that I’ve found helpful in a merge is to call a custom – bp-header.php in the bp dependent files to reduce a bit of weight on the non bp pages, reduce any instances of javascript conflicts, increase the design and flexibility of the BuddyPress pages, and use bp specific functions(<?php bp_page_title() ?> in the alternate header.php ~ so I swapped out the get_header’s, sidebar’s, footers on the default theme with these ~<?php locate_template( array( ‘bp-header.php’ ), true ) ?> or <?php include (TEMPLATEPATH . ‘/bp_header.php’); ?>
@ScotM – Although converting a WordPress theme to a BuddyPress child theme is a bit more challenging than converting an HTML template to a WordPress theme is, the basic concepts are the same – knowing at the very least, HTML and CSS plus basic PHP and JS, and adapting it to the required environment.
The level of difficulty and required skills for conversion of a WordPress theme to a BuddyPress theme depends on what aspects of that WordPress theme you want incorporated into your BuddyPress theme.
– If it’s the styling or layout, then level of difficulty and required skills = Medium.
– If it’s incorporating/combining functionality and design of a WordPress theme framework like what @designodyssey and @Windhamdavid are discussing above, then level of difficulty and required skills = High.
– If it’s incorporating/combining functionality of truly advanced layout designs and functions like what you would see in say, Headway theme or ithemes’ Builder Theme, then the level of difficulty and required skills = Superduper.
So to better address your question, my question is what WordPress theme were you thinking of porting over as a BuddyPress child theme?
@mercime I’d like to hear from someone who has enabled the P2 theme for BuddyPress, for starters, and I’m not looking for major customizations.
Simply ensuring that the features within BuddyPress stay intact when using P2 versus the default theme would do nicely.
Thx
Guess it depends on a couple things:
– what you want on the front page (activity stream vs posts)
– if there’s any javascript/ajax conflicts between bp & p2.
man I wish I had time to play.
@andrea_r i’m looking to have posts on the main page. definitely potential for conflicts with js/ajax.
So anyone have a general guide to converting an existing WP theme to work with BP 1.2?
Thx
I think you can do it the same way as upgrading theme from 1.0 to 1.1..
https://codex.buddypress.org/how-to-guides/upgrading-a-buddypress-1-0-theme-for-buddypress-1-1/
The conversation has a little traction over here
https://buddypress.org/forums/topic/new-theme-framework-and-exisiting-wp-themes
you will want to read over this as well.
https://codex.buddypress.org/how-to-guides/upgrading-a-buddypress-1-0-theme-for-buddypress-1-1/
I’m aware of both threads but as you know they’re pretty old and do not address 1.2.
Am I the only one who finds it strange the idea of using existing WP themes with BP should be more of a priority (at least a detailed tutorial or blog post explaining How), versus creating child themes from the parent?
I see the benefits for the latter, obviously, but I can envision many WordPress users who wish to implement BuddyPress without switching away from their existing theme, etc. Is this not creating a significant barrier to entry?
@Scotum
I fully agree with you on all points. I would love to make Buddypress part of my existing website.
I would expect someone who really knows how this thing works, will create a set of theme files to drop into an existing website, in order to allow the buddypress plugin to work properly. It just might be we are here a month to early.
Today another release candidate came out. They are hoping to have the final version early next week; so it is written. I have a feeling the whole team is focused on getting 1.2 finalized and will deal with theming issues soon after.
One of the things I would like to cover on the new BP-Tricks site, is how to do this.. Maybe with a videotutorial or atleast a few written tuts. This will be a matter of time, don’t forget how much is changing everyday for BP, there are only a handfull of people who have done this
A tutorial for this will be put up, it’s not a priority until after 1.2 is released.
Thanks!
Do you have an updated ETA on the WP theme to BP theme tutorial mentioned above? Thanks!
That looks like what everybody needed
Great, the zip is filled with loads of .tmp, .svn, _MacOSX files though (346 files in 187 folders!). Andy/whoever made it, maybe it should be repackaged?
Also, the instructions on https://codex.buddypress.org/how-to-guides/wordpress-to-buddypress-theme/ are a bit confusing; if somebody got it working, maybe they can edit the documentation with some example codes?
We need to version that .zip otherwise we are going to have to wade through hundreds of confusing topics in future BP versions.
I’ve tried this on two standard WordPress themes and it breaks the CSS in the theme each time at the content section. any ideas on this?
These are the directions I used.
https://codex.buddypress.org/how-to-guides/wordpress-to-buddypress-theme/
That’s pretty much how to do it. You have to go thru the BP files you added to your theme and change the markup to match your WP theme.
@armandmorin – it’s more than likely either the “container” or “content” div in your WordPress theme. The BuddyPress template pack uses:
[header]
<div id="container">
<div id="content">
[content]
</div>
<div id="sidebar">
[sidebar]
</div>
</div>
[footer]If your WordPress theme doesn’t match this, then there are about 6 or 7 templates (mainly members/index.php groups/index.php etc etc) that you will need to tweak this html layout in to match the one used by your theme.
Once you have it matched, then the content should sit in the correct place and not break the layout. If you’re using a theme with this HTML layout, then you should be fine off the bat.
- The topic ‘Convert a WordPress Theme to a BuddyPress Theme’ is closed to new replies.