How To Make Your WordPress Theme Compatible With BuddyPress

***UPDATE***

This post is a little outdated now and the new process is outlined at the plugin page in the WordPress repository: http://wordpress.org/extend/plugins/bp-template-pack/

————————————————————————————————————————————————————————————————

BuddyPress 1.2 official release is finally here with native support for WordPress. The BuddyPress site is also sporting a new look highlighting all of the plugin’s features.

bp1.2

We’re going to see floods of new users from the WordPress single user community because of the latest release. You may be asking the question – how can I keep my current theme and incorporate BuddyPress functionality? This tutorial will help you do that.

If you want to keep your present WordPress site theming and include the BuddyPress plugin, you will need to know how to make your theme compatible with BuddyPress. I’m going to walk you through this handy guide, available at the BuddyPress codex, for making your theme compatible.

First thing you need to do is make sure you have WordPress and BuddyPress installed. This has been simplified to 3 steps, as you can see in the instructions currently displayed on the BuddyPress.org site:

install

1. Download and Set Up WordPress with the Famous 5 Minute Install.
2. Plugins >> Add New >> BuddyPress
3. Activate the bundled theme or add your own

This tutorial is assuming that you are wanting to use your own theme but make it BuddyPress-aware.

Step 1. Download the BuddyPress theme extension pack.

This is not something you place in the plugins folder. You need to drop the contents of the extension pack into the WordPress theme folder that you are currently using.

Step 2. Edit the “functions.php” file in your WordPress theme.

Open up this file and add the following line to the very top right after the

1
<?php
1
include( TEMPLATEPATH . '/bp/bp-functions.php' );

Step 3. Add BuddyPress Tags to your theme’s style.css

Add a “buddypress” tag to the top of the file. If you don’t see this line, add “Tags: buddypress” to the last line of the comment header without the quotes. This will tell BuddyPress that your theme is BuddyPress enabled.

Step 4. Refresh your site and check out the changes

The way to know that it’s working is that you will now see the BuddyPress bar across the top of the page. The BuddyPress pages should now be working with your theme, although the stying that comes with the theme extensions pack is fairly basic. You’ll want to get it styled to match your current theme. The ability to make your current theme BuddyPress aware is much simpler than the process used to be and will definitely make WordPress social networking more accessible for those who already have a single user WordPress site in operation. Let us know if you encounter any snags and if you have any more specific tips for adapting themes to BuddyPress. Happy theming! :)

41 Responses

    Jeff

    Followed the steps (thanks for them by the way)

    The problem I am having is that the admin bar doesn’t work. None of the links go anywhere.

    James

    Hi, i have a question, in the search from (up, right), only is allowed ‘Members’, ‘Groups’, and ‘Forums’,

    I want to add ‘General’, that will search into ‘blog post’, and ‘blog pages’, my question is… how I could do this? I think its a very simple problem, so i think its a very simple solution.

    ;)

    Thanks

    Hart

    Still having problems with step1. Unzipping the extension pack keeps giving me an error about a file with the same name (bp-template-pack), but changing the zip file name or folder doesn’t solve it. Also, assuming the package is successfully extracted, do ALL files contained in the package need to uploaded to the theme’s folder? That is a lot! Thanks.

    Jason Knouse

    Thanks for the great post!

    I’m working on a custom BP theme, which needs tweaking … but … during my testing, I continue to get the following at the top of the page (I followed the directions here closely – what am I missing / screwing up??):

    ——————————————————————————-
    Warning: include(/home/getinda1/public_html/imnoob.net/wp-content/themes/psd2css/bp/bp-functions.php) [function.include]: failed to open stream: No such file or directory in /home/getinda1/public_html/imnoob.net/wp-content/themes/psd2css/functions.php on line 2

    Warning: include() [function.include]: Failed opening ‘/home/getinda1/public_html/imnoob.net/wp-content/themes/psd2css/bp/bp-functions.php’ for inclusion (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/getinda1/public_html/imnoob.net/wp-content/themes/psd2css/functions.php on line 2
    ——————————————————————————-

    Thanks for any help or fix-it tips!!

    Jason
    imnoob.net

    ChaosDarky

    Copy all the files of bp-template-pack to your main theme directory.

    or change this line in functions.php

    include( TEMPLATEPATH . ‘/bp/bp-functions.php’ );

    into

    include( TEMPLATEPATH . ‘/bp-template-pack/bp/bp-functions.php’ );

    Sarah Gooding
    • Post author
    • 44
    • #2557

    Yeah the issue you’re getting is because you tried to upload the bp-template-pack folder to your server instead of uploading all the files inside it. You won’t receive that error if you change the template path as shown in the comment above or simply upload the contents of the folder instead of the folder itself.

    Jeff

    @ChaosDarky

    For my permalinks I have been using /%year%/%monthnum%/%postname%/

    Is there a better combination I should be using?

    Jason Knouse

    Choas / Sarah!

    Is it inappropriate to say, “I LOVE YOU!!!!!” Thank you guys, it worked like a charm and my custom theme is being recognized. Now, on to figuring out how to develop internal customs themes (“child”, right??).

    One note, at least for my isolated case, is it required BOTH the line additional in “functions.php” & correctly copying the bp-theme-pack files to my “wp-content/themes” folder … maybe that was what you were saying all along (forgive my non-techie brain).

    Again, thanks a million (but, I’m pretty sure I’ll be back soon!)

    Jason

    Tom

    Hello! I’ve followed the steps (very simple indeed). However, I received the following error when attempting to click through to the first ACTIVITY link:

    “404 Not Found Error: The requested URL /share/members/Tom/activity/ was not found on this server.”

    The same error occurred when attempting each of the drop down selections (Profile, Messages, Friends, Groups, Settings)

    The theme I am using is located via: /share/wp-content/themes/lightword which is where I added the contents of the BP Template Pack contents (note: I added each folder within the pack, not the parent pack folder itself).

    Within the LIGHTWORD theme, I located “functions.php” and added “include( TEMPLATEPATH . ‘/bp/bp-functions.php’ );” per instructions.

    I then added /* Tags: buddypress */ to the CSS file.

    I saved and uploaded each.

    Any suggestions on what I should modify? NOTE: I am NOT a PHP programmer.

    Thanks for any help!!

    AntonRSA

    This is really cool. Thanks for sharing the info.

    I’ve got on BP site running on v 1.1.3 with two plugins – bp link and bp events. I’m still running wpmu 2.8.6 and too scared to update the wp version as I might break the other plugins – lots and lots of custom code. Do you know of anyone that can assist in the upgrading of my system?

    Regards,
    AntonRSA

    Jayson

    I am attempting to add bpress 1.2 to a child theme for the new Studio Press Genesis theme. Should I add the extension pack to the child theme folder or the main Genesis directory?

    Thanks!

    Michelle

    Like Jeff, I’ve followed the steps, and my permalink settings are day and name, but all of the links just send me back to my homepage? What am I doing wrong?

    Yahzee

    Thank you so much for the article. Now my new website will be BuddyPress ready

    Jeff

    ChaosDarky,

    I tried the following method and it didn’t seem to make a difference. My links still do nothing.Try to use my permalinks structure..

    /%category%/%postname%.html

    Michelle – did that work for you?

    Chris

    I’m struggling with step 3. I don’t know css at all. Where and what do I need to add the tags to. Any help you can give me would be great, I’m still getting the “buddypress is ready” message on my dashboard.

    Thanks!

    Andy P

    Please can you update this article since all this information is now out of date. Just point them to the plugin, thanks.

    Jeff

    This new plugin is such a great help in setting up buddypress with your own theme. Still doesn’t change the fact that my buddypress bar links don’t go anywhere. They just refresh the home page. Does anybody have a solution for this?

    Chris

    HEre’s what the BP compatibility says:

    To remove the “BuddyPress is ready” message you will need to add a “buddypress” tag to your theme. You can do this by editing the style.css file of your active theme and adding the tag to the “Tags:” line in the comment header.

    So..I go to the style.css and click on the “comments” on the right hand toolbar (which brings it up in the style.css).

    Question where exactly is the “Tags:” line? and when I find it I am needing to type the word “buddypress” there. I’m assuming “tags: buddypress”…???

    Thanks so much for your help. I can’t wait to get started building my site!

    Sarah Gooding
    • Post author
    • 44
    • #2557

    Andy- No problem. I added a little note at the top of the article to direct people to the plugin page for instructions. Thanks.

    Naweed

    This is a perfect solution but there’s one question I’ve been asking everyone, when we add buddypress to the main theme how do we get the profile layout to match rest of the site?

    How do we add widget areas to the homepage of the theme, i.e in the content areas to display latest activities etc?

    Sounds quite confusing.

    Any help here?

    Michelle

    No, It’s still not working for me either Jeff =/
    I don’t understand what i could have possibly done wrong :S

    sam

    Like Jeff,

    I am also unable to have any page from buddypress load under the “My Account” and “Notifications” tabs. Curiously, the only page that loads is the Random Group link under the “Visit” tab on the far right. Perhaps that is a clue as to why the other pages of buddypress are not loading?

    My permalinks have been adjusted off of the default. I do not know what to do to get my buddypress to work!

    Jeff

    OK. For all of us out there that are having problems with the buddypress bar not working, I think I might have somewhat of a solution.

    I found out, at least on my site, that its an admin issue. I decided to log out and made sure that the buddypress bar was visible to non-logged in users as well. Then I created a new test user through the buddypress bar. For the test user everything works perfectly. It must have to do with the admin account being made previous to the buddypress install I’m guessing.

    So short story long, create a test account through the buddypress bar and hopefully that will help.

    I still have no idea how to get my admin account to do jack with the buddypress links or pages, but at least this helps me see how it works for my new users.

    Art Eppley

    Ok, I have installed buddypress sitewide… added bp-template-pack/bp/bp-functions.php to my functions file and added the tag to my style.css When I hist a profile link on my theme.. I get a backend profile :( is there something I am missing?

    Art Eppley

    side problem… my “admin bar appears at the bottom of the admin pages… and is NOT styled in anyway :(

    naqiu

    Thank its work…
    Hahaha.. its work..
    Good jod…

    Shaun

    I’m really confused. my admin bar doesn’t appear and I’m not sure where to put what folders. Nothing makes it work so far.

    Charles

    How do I remove the search on buddy press theme or move it a up a bit. Help!!!

        mattfraser

        Thanks Sarah, I just saw that as I dug for the info. This is great news as I’ve been wanting to use buddy press with the vantage theme from app themes and was even going to have a special plugin built. Does it matter at all if the theme developers haven’t updated their code?