Firstly, I take no responsibility at all if you break your website, do these steps at your own will! I suggest doing this in a local environment, aka, on your local machine!! once you get your theme working with buddypress locally, do what you want with it, again, I take no responsibility! Although it looks long and tedious, I have tried to make this tutorial as readable as possible for everyone. If you find it useful, please link to this article!
Before we begin, you need of course, your copy of Genisis and a Buddypress compatible child theme, for this, I will use… hmmmm… Outreach Child theme, this tutorial is on a single user wordpress install, not wordpress mu, I am sure the same will apply. Also, once you complete these steps, you are responsible for styling! May I suggest looking at members.css included in the bp-default theme.
Please note, I have also tested this with NON compatible child themes, and have it working flawlessly on the Church theme, needs a few minor adjustments to the work below, so email me if you need help.
You will need the following tools/plugins:
Textmate, or another text editor capable of opening an .htaccess file
Buddypress (duh!) I will be install bp 1.2.1
All in One SEO Pack
Genisis Simple Hooks
BP Template Pack
A cup of your favorite beverage…
Let’s begin.
1. Place your Genisis theme, along with the compatible child theme into your /wp-content/themes/ folder, then go ahead and copy all of the plugins mentioned above into your /wp-content/plugins folder.
2. Head into your wordpress dashboard, and go into Appearance, Themes and activate the child theme you want to work with. Check it out, looks pretty.
3. Move into Plugins and activate Buddypress, you may get the following error “BuddyPress is almost ready. You must update your permalink structure to something other than the default for it to work.”, simple fix, do as it says, and change your Permalink settings to something else, go to Settings, Permalinks, select… maybe, Day and name, save changes and continue.
Check out your site, pretty ugly, and none of the buddypress buttons take you anywhere, and no buddybar, everything is under your design, doh, lets go ahead and fix that now
4. Go back to Plugins, and activate the Buddypress Template Pack, once you have done that, go to Appearance, BP Compatibility, click the “Move Template Files” button, hopefully you get the success message, if you didn’t, read the instructions, probably will be a permissions issue. Move on to step 3, scroll down and hit the “Finish Button”. Congratulations, check out your site! Looking better, the buddybar is where it should be, but there is nothing in the main navigation yet, some buddypress things look ugly also!
Now the slightly painful part, you need to “fix” the template files that have just been copied into your CHILD theme folder! Make sure the permissions allow you to play with the files first!
5. Open the child theme folder, the entire child theme folder, in Textmate (or similar). Do a ‘Find in project’ search, you can do this from the Edit, Find and Find in project. Paste this code into the find <?php locate_template( array( ’sidebar.php’ ), true ) ?> and click find, this should show up 13 results, click on the top one index.php, located just above <?php locate_template( array( ’sidebar.php’ ), true ) ?> are 2 div tags, which look like this…
UPDATED: To please change all php files in your child them that have the following code
to the following…
<div id=”content-sidebar-wrap”>
<div id=”content” class=”hfeed”>
<div class=”post-2 page hentry”>
because we added a new div above, we need to close it below! so change the 3 lines below to the 4 lines.
</div><!– #content –>
</div><!– #container –>
<?php locate_template( array( ’sidebar.php’ ), true ) ?>
The above code should now look like the following 4 lines, note the extra </div>
</div>
</div><!– #content –>
<?php locate_template( array( ’sidebar.php’ ), true ) ?>
</div><!– #container –>
You will have to do this to all 13 files, you can do a search and replace, it’s up to you how you do it, I would prefer to do it 1 by 1, its only 13 files… go on, get cracking, i’ll wait for you…
Finished? good, move on to step 6
6. Things will still look a little weird depending on what theme you chose to work with, you need to do another ‘Find in project’ search, this time, search for ’subnav’ (without quotes), This will yield 11 results, including style.css, you need to change all occurrences of subnav, to something like, subnav-buddy, do NOT change anything in the style.css file. We are changing this, because the current theme you chose also uses the tag subnav for styling, which will really muck up your designs, so do this step while I wait for you…
7. Quick step, open style.css, I use CSSEdit, but again, use whatever you have, do a search for #inner, under the first result, will be this line:
.home #inner, .home-page #inner, .blog #inner {
You will need to change that line to the following, on some themes, if you miss this step, the groups page will just be plain UGLY! so do this step.
.home-page #inner {
Save and close
Ok, you are nearly there! and things are looking good… but the title tag is now missing on all your buddypress pages, these are super important to get right! so move onto step 8
8. We need to head back to our wordpress dashboard, back to Plugins, and activate All in one SEO pack, there will be a big ugly red message, click on the ‘Go to admin’ link, on the page you arrive at, look for Plugin Status, select Enabled, scroll down and hit Update Options. You aren’t quite ready yet… step 9 awaits
9. Back to Plugins, and activate the Genisis Simple Hooks, once activated, go to the Genisis section in your wordpress dashboard, click Simple Hooks, on this page, you will be greeted with a massive about of boxes, the 3rd box down is what we are looking for, which is this box “genesis_title Hook”, in the box under this heading, paste in the code <?php bp_page_title() ?> this is important, make sure you check the box that says Execute PHP on this hook, and Save the changes, wow!! we now have title tags! we are nearly done!!! we need to add it to the navigation and we are all set.
10. Now, there will be plenty of ways you can do this, and this way is probably a really bad way, but hey, it works, and its FREE, go to your dashboard, go to Links, add a new link category, Our Community in the category name, and our-community in the slug. Now add your links to Our Community, which you just made to your buddypress pages, these are the main ones, add what you want i.e
Groups – http://www.yoursite.com/groups
Forums – http://www.yoursite.com/forums
Members – http://www.yoursite.com/members
Again, make sure these links are in your Our Community link category… MAKE NOTE of the cat_ID of your category, you can find this by hovering over your category, it will show in your browser when you hover, mine is cat_ID=3, noted, you need it on the final step. You can now use these links in your sidenav which will show Our Community as the header, cool!
11. Now go to Genisis, Theme Settings and uncheck your “Include Primary Navigation Menu”, this will remove the main navigation, but don’t worry, we are going to add our own using Simple Hooks, so go back to to the Simple Hooks area, you need to add some code to the “genesis_after_header Hook” box, so find that. Again, select Execute PHP on this Hook, and past in something like the code below, the wp_list_bookmarks is your link category you just made, so change your category number, to yours, if it is different to 3:
<div id=”nav”><div class=”wrap”>
<ul>
<li><a href=”<?php bloginfo(‘url’); ?>” title=”<?php bloginfo(‘name’); ?>”>Home</a></li>
<?php wp_list_bookmarks(‘title_li=&categorize=0&category=3′); ?>
</ul>
</div>
</div>
Oh, one more thing, your server might be set up with lower memory allocation, if you have issues, you need to add this into your htaccess file, paste it in the top and you should be all good.
### Set PHP Memory Directive ###
php_value memory_limit 60M
That’s it! if you want to add your categories to the above list, just search for wp_list_categories and/or wp_list_pages. Again, think about styling your buddypress pages now, I recommend using members.css from bp-default theme and go from there.
Hope that helps some of you out with getting Buddypress working with Genisis Child themes, if you found this helpful, please send a link my way.