Skip to:

Extending WordPress Themes – Post Experiences

  • Profile photo of Andy Peatling
    Andy Peatling


    I’m looking to writing a how-to for the codex on extending existing WordPress themes so they will work with BuddyPress 1.1.

    A number of people on the forums here have posted that they have done this. To make sure I’m not over looking any techniques, could those people who have done this please post how they approached it?


Viewing 7 replies - 1 through 7 (of 7 total)
  • Profile photo of Detective


    My approach is kind of weird.


    I needed a custom BP framework. So I started looking at the old Skeleton Theme. The first thing I noticed is that I didn’t want a fixed layout BP theme, so I removed all sidebars in each template file and wrapped the content inside a function.

    This means that every template file of my BP theme was something like this:

    /* my license ... GPL2 of course :) */

    function this_file_content() {
    just the content of the page, without sidebars

    my_layout_generator( 'this_file_content' );

    The magic is in my_layout_generator, which defines the html layout of each page. This includes sidebars and other stuff. The sidebars are fully widgetized, and I have custom widgets like “BP Options Bar” and “BP User Bar”, etc. Their content is also managed through actions.

    my_layout_generator can mimic any WordPress theme, you just have to write the “skeleton layout” of your target theme.


    This BP framework must be integrated with the WP theme. I setup the framework as child-theme and the original WP theme as parent theme.

    Considering this, my_layout_generator has the following body (simplified from the original):

    function my_layout_generator( $content_func = '' ) {

    <div id="container">
    if ( !empty( $content_func ) && is_callable( $content_func ) )
    call_user_func( $content_func );
    <div id="sidebars">
    <?php // your sidebars code ?>


    This uses the original theme headers and footers. I just need to provide the correct markup in the content!

    There are other things to care about, like page title. Probably the header of the original theme uses wp_title instead of the BP title. Luckily, wp_title can be filtered! This is actual code from my framework:

    add_filter( 'wp_title', 'gs_wp_title' );
    // we need to put the current page title on the wp_title filter, so thesis will catch it
    function gs_wp_title($title, $sep = '', $seplocation = '') {
    if ( bp_is_blog_page() )
    return $title;

    global $bp;

    if ( !empty( $bp->displayed_user->fullname ) ) {
    $title = strip_tags( $bp->displayed_user->fullname . ' — ' . ucwords( $bp->current_component ) . ' — ' . $bp->bp_options_nav[$bp->current_component][$bp->current_action]['name'] );
    } else if ( $bp->is_single_item ) {
    $title = ucwords( $bp->current_component ) . ' — ' . $bp->bp_options_title;
    } else if ( $bp->is_directory ) {
    if ( !$bp->current_component )
    $title = sprintf( __( '%s Directory', 'buddypress' ), ucwords( BP_MEMBERS_SLUG ) );
    $title = sprintf( __( '%s Directory', 'buddypress' ), ucwords( $bp->current_component ) );

    return $title;

    Now we have an integrated BP theme framework :) Mine is integrated with Thesis, I think other themes will be much easier to integrate because you can directly copy their layouts from their template files.

    Profile photo of gian-ava


    Sorry, I deleted the post. I pasteed it into the wrong topic.

    Profile photo of designodyssey


    This is awesome. Of course, I’m not a coder and don’t understand it yet, but it’s a beginning. I will try the same thing with Hybrid theme next month. Not sure about using the custom function, but if it’s easier and more flexibile, I guess I’ll learn.

    Thanks for sharing this. I’m sure MANY are thinking about how to do this

    Profile photo of Tore


    I did it with P2 and an Artisteer-theme. It’s pretty much finished.

    Just integrated as per codex instructions (copied all the folders and some files from BP-theme).

    1. I called for another CSS in the header instead of in the actuall css file. Had problems with the latter.

    2. Didn’t register userbar/optionsbar. Integrated them into navbar or individual pages (all user settings was placed on “profile”). This wasn’t intended at first but was a great way of handling the horizontal space problem. P2 and my theme are intended for a width of about 900px. Without the vertical userbar/optionsbar you can make it fit into that small space.

    3. I made all the content fit by handling the CSS item “content” with a good width and overflow.

    4. This however made me have problems with the sidebar widgets that are hardcoded (please make them into widgets instead). I had to rip them out because they disturbed the layout.

    5. Had to do some additional skinning and handle a fixed amount of categories for the forums.

    I just love how components.css did a lot of the work. Thanks a lot Andy!

    Profile photo of bloggista


    Argggg, I spent 24 hours of non-stop trial and error (considering I am a PHP noob) to make my site work after the buddypress 1.1.1 upgrade. Made a lot of tweaking with the avenuek9 theme to look like how my site used to looked like before the upgrade. I hope you gurus can make this How-to- stuff soon. If you look at my site, its still a mess ( but it should be back in its handsome form once those minor issues are ironed out. Like, the recently active avatars are lining up in single file down to the bottom as if they’re queuing for the some firing squad.

    Thanks folks, looking forward to it.

    Profile photo of capitalistdog


    By skeleton theme, do you guys mean bp-sn-parent?

    Profile photo of Detective


    If you are interested, I’ve released my Thesis integration.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Extending WordPress Themes – Post Experiences’ is closed to new replies.
Skip to toolbar