Skip to:
Content
Pages
Categories
Search
Top
Bottom

Extending WordPress Themes – Post Experiences

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

    Thanks.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Avatar of Detective
    Detective
    Participant

    @detective

    My approach is kind of weird.

    First:

    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:

    <?php
    /* my license ... GPL2 of course :) */

    function this_file_content() {
    ?>
    just the content of the page, without sidebars
    <?php
    }

    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.

    Second:

    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 = '' ) {
    get_header();

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

    get_footer();
    }

    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 ) );
    else
    $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.

    Avatar of gian-ava
    gian-ava
    Participant

    @gian-ava

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

    Avatar of designodyssey
    designodyssey
    Participant

    @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

    Avatar of Tore
    Tore
    Participant

    @toregus

    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!

    Avatar of bloggista
    bloggista
    Participant

    @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 (http://bloggista.net) 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.

    Avatar of capitalistdog
    CapitalistDog
    Participant

    @capitalistdog

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

    Avatar of Detective
    Detective
    Participant

    @detective

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

    http://buddypress.org/forums/topic/genealogies-theme-integrated-with-thesis

Viewing 7 replies - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.