Skip to:
Content
Pages
Categories
Search
Top
Bottom

Convert a WordPress Theme to a BuddyPress Theme


  • Scotm
    Participant

    @scotm

    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

Viewing 25 replies - 1 through 25 (of 50 total)

  • thekmen
    Participant

    @thekmen

    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.


    Xevo
    Participant

    @xevo

    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.


    Andrea Rennick
    Participant

    @andrea_r

    That’s the exact opposite of what he needs though. :)


    Xevo
    Participant

    @xevo

    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.


    designodyssey
    Participant

    @designodyssey

    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.


    Windhamdavid
    Participant

    @windhamdavid

    @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’); ?>


    @mercime
    Participant

    @mercime

    @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?


    Scotm
    Participant

    @scotm

    @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


    Andrea Rennick
    Participant

    @andrea_r

    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. :D


    Scotm
    Participant

    @scotm

    @andrea_r i’m looking to have posts on the main page. definitely potential for conflicts with js/ajax.


    Scotm
    Participant

    @scotm

    So anyone have a general guide to converting an existing WP theme to work with BP 1.2?

    Thx


    Reezo
    Participant

    @reezolution

    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/


    fastfido
    Participant

    @25knots


    Scotm
    Participant

    @scotm

    @25knots

    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?


    fastfido
    Participant

    @25knots

    @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.


    Bowe
    Participant

    @bowromir

    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.


    Scotm
    Participant

    @scotm

    @Andy

    Thanks!


    gpb
    Participant

    @gpb

    @Andy

    Do you have an updated ETA on the WP theme to BP theme tutorial mentioned above? Thanks!


    andrew_s1
    Participant

    @andrew_s1


    stripedsquirrel
    Participant

    @stripedsquirrel

    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.


    armandmorin
    Participant

    @armandmorin

    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/


    Andrea Rennick
    Participant

    @andrea_r

    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.

Viewing 25 replies - 1 through 25 (of 50 total)
  • The topic ‘Convert a WordPress Theme to a BuddyPress Theme’ is closed to new replies.
Skip to toolbar