During a recent project I had a need to create a super simple manual verification option for users in BuddyPress – so I thought I’d share it with you all. In this post I’ll show you how to use Advanced Custom Fields (ACF) to add a “verified profile” option for a user on the back end – and display the status on the front end.

You’ll need to have Advanced Custom Fields installed and activated before you start. You can install Advanced Custom Fields by going to WP Admin > Plugins > Add New and searching for the plugin.

Create the field group

Go to WP Admin > Custom Fields > Field Groups and create a new field group titled ‘Verify Profile’ or something similar. This will be used as the title for the field when editing the users profile, so keep it relevant.

Let’s set the rules of where and for who it will appear. In the section titled ‘Location’ select the following

  • User Form > is equal to > Add / Edit (this means it will only show the field when editing the user profile or creating a new user via wp-admin)
  • Current User Role > is equal to > Administrator (this means it will only show the field group if the current user is an admin)

Create the field

Add a field by clicking “+ Add Field”, set the following options:

  • Field Label: ‘Is this user verified?’
  • Field Name: ‘is_this_user_verified’
  • Field Type: ‘True / False’
  • Message: Any text you wish to appear alongside the field when editing a profile

Save your field group, location data and custom field by clicking ‘Update’.

Verifying a user

Verify a user by going to WP Admin > Users and edit any user. When you scroll down to the bottom of the page you’ll now see a checkbox under the heading ‘Verify Profile’ titled ‘Is this user verified?’. Check the box to verify the user, or leave unchecked to keep the user unverified.

Adding the code

The below code is displayed on all users profiles, it checks if the current profile is verified or not and prints the appropriate HTML. You will need to modify this code to suit your needs on lines 7 and 10 (highlighted below).

Add the below code to your child themes functions.php file or in the bp-custom.php file.

function ktio_add_verified_status_member_header() {

    $current_profile_id = bp_displayed_user_id();
    $verified = get_field('is_this_user_verified', 'user_'. $current_profile_id);

    if ($verified == 1 ) { 
        echo 'MY HTML FOR VERIFIED';
    }
    else {
        echo 'MY HTML FOR NOT VERIFIED';
    } 
}
add_action('bp_profile_header_meta', 'ktio_add_verified_status_member_header');

You’ll need to customise the HTML and CSS in the code to suit your theme. If you’d like help with achieving this feel free to contact me.

Example with custom HTML and CSS

Below is an example of the code being used in KLEO with custom HTML and CSS.

Verified user rendered on the front end

The code used in the above example is shown below. Note the HTML on lines 7 and 10.

function ktio_add_verified_status_member_header() {

    $current_profile_id = bp_displayed_user_id();
    $verified = get_field('is_this_user_verified', 'user_'. $current_profile_id);

    if ($verified == 1 ) { 
        echo '<div class="text-center" style="margin-top:10px;margin-bottom:0px;"><i class="icon-ok-circle icon-2x hover-tip" data-toggle="tooltip" data-original-title="Verified" data-placement="right" style="color: #74d42e"></i> </div>';
    }
    else {
        echo '<div class="text-center" style="margin-top:10px;margin-bottom:0px;"><i class="icon-circle icon-2x hover-tip" data-toggle="tooltip" data-original-title="Unverified" data-placement="right" style="color: #dddddd"></i> </div>';
    } 
}
add_action('bp_profile_header_meta', 'ktio_add_verified_status_member_header');

Let me know if this was helpful, if you’d like to see more like this or if you have any other questions by leaving a comment below.

Leave a comment

In response to:

Verified profiles in BuddyPress with Advanced Custom Fields

Your email address will not be published. Required fields are marked *

*