How To Customize Your BuddyPress

How to edit BuddyPress code, the right way.

Resource basis for this article: links supplied by @danbp and @shanebp at BuddyPress.

References for buddypress code: PHPXref / Hookr

Let’s start with an example that will show us editing the code and seeing the edit on our live website:

Let’s make some changes to the way our “Profile” page looks. Let’s put the words “The Speaker” somewhere on the page, just to see ourselves effect the code.

(You need FTP.)

Step 1: Copy the entire buddypress\bp-templates\bp-legacy\buddypress\ folder over to your computer.

ScreenHunter_86 Oct. 17 14.09

(Clarification: go into html (root), then into wp-content, then into plugins, then into buddypress, then into bp-legagy, then copy that “buddypress” folder you see onto your harddrive.)

Step 2: put a copy of that folder into your theme (the theme you want to run on your website). You just paste the “buddypress” folder right into your theme.

Now you can edit the files in the “buddypress” folder that is in your theme folder. This is called “overload.” The buddypress plugin files aren’t altered because they’re still in your plugin folder. But buddypress is going to look in your theme first for files and if it finds one that’s the same (and follows the same path from folder to folder to file) it will load the version in your theme, “overloading” its default file.

So we can now edit our “profile” page without messing up buddypress’s code. Let’s do that.

Go to YourTheme/buddypress/members\single\and open the “profile” file.  Type in “The Speaker” somewhere (make sure it’s not within php). A good place is right under <div class=”profile”> .

Save it where it is. Reload your profile page and you should see it display.

ScreenHunter_87 Oct. 17 14.17

We have successfully edited BuddyPress code without messing up the BuddyPress plugin.