A recent client of ours needed the ability for users to upload a profile picture (avatar/gravatar) when registering on their site. They use Paid Memberships Pro (PMPro) and BuddyPress. Both are great plugins but don’t handle this on setup.

The problem we ran into is that BuddyPress handles it’s avatar/user profile pictures differently, so we needed a solution that would allow the user to add a profile picture while registering with PMPro, but then register that photo for use with BuddyPress as well.

The Solution

Our solution had to work for both PMPro and BuddyPress (BP), and involves using the PMPro Register Helper Plugin, some custom code to add the profile picture, and WP User Avatar.

1. Install Paid Membership Pro

Make sure you have Paid Memberships Pro installed. This will work with both the free and paid versions. After installing, set up, and configure.

2. Install PMPro Register Helper

You will make sure you have installed the Paid Memberships Pro – Register Helper Add On. Just install, and there shouldn’t be any settings you need to make.

3. Install The Extension

The next step is to include the code. You can create a plugin, or paste the code into your theme’s function.php. We have created a plugin, however, to make it simpler.

Download the plugin here.

4. Design Changes

If you don’t have css on BuddyPress for the avatars, you will want to use something like the following css to your them’s style.css to make the avatar show nicely.

.single-headers img.avatar {
    max-width: 150px;
    max-height: 150px;
}