In a recent project, I had to create a custom BuddyPress member list. I had to display members by their membership. So, I wanted to write a simple tutorial in which I’ll show you how to display members by their roles. In this article, you’ll learn how to create a custom member tab and how to filter only the users we want.

This tutorial will also require some customization of the BuddyPress Member list template, but I’ll show you that at the end of this article.

In this tutorial, we will show users that have the Administrator role, but you can easily copy or edit the code to show other users.

You can put this code in your theme or in a plugin. For this projects, which was a specific theme, I have put this in a child theme.

Getting the User IDs

Let’s define the function that will return an array of user IDs that we can then use for filtering.

In this function, we are also using transients. That way, we won’t have to make database queries that would take more time. That will be done only once every 12 hours. You can change that if you want.

To get the users, we are using the function get_users(). You can read more about that function on the WordPress Codex. So, to get only the array of user IDs, we just have to define the parameter fields and use the ID. You may add other fields, but as long as the value of that parameter, is not an array, you’ll get user IDs.

We are also defining another parameter role__in. This parameter will limit the query to only the users that have the role administrator.

Adding a new Tab to the BuddyPress Members Directory

BuddyPress Directory showing Tab

You’ll see this new tab after the code

By using the filter bp_members_directory_member_types, we can add our own tabs on the BuddyPress members directory page. To create a linked tab, we will also use the function bp_get_button().

The arguments we pass to the function bp_get_button() are:

  • id – Description of the button type
  • component – Name of the component this button belongs to. Our component is members
  • link_text – Text of the link
  • link_title – Attribute title of the link
  • link_class – Classes added to the link
  • link_href – URL. We are setting the query string show. We will use that query string to filter the user query
  • wrapper – If set, that element will wrap the button. Example div
  • block_self – If true, the button will be hidden if the user is viewing his/her profile
  • must_be_logged_in – If true, the button will show only if the user is logged in.

We are also putting the class current when we are on the directory page and the query string is set to ?show=administrators.

Filtering the BuddyPress Members Directory by Role

Showing only administrators on the Administrator Tab

Filtered Users

We now have both the button and also the function to get the user IDs that we want to show. We can filter the BuddyPress member directory by overwriting the arguments that are passed when getting the users. That filter is bp_after_core_get_users_parse_args.

By passing the user IDs that we get from our function bp_get_only_administrators_ids into the parameter $r, we are telling to BuddyPress, that we want only users with those IDs.

Changing the Default Members Tab

This part is not a required one to filter the members. But, because of the BuddyPress JavaScript, the default member tab will always get the class selected and thus, it could confuse your visitors.

You can do that by overriding the BuddyPress templates. For this part, you just need to have a folder buddypress inside your theme. Inside that folder, another one called members. Inside that folder, you need to copy the index.php from the BuddyPress folder bp-templates/bp-legacy/buddypress/members/index.php.

Then do this:

Just find the class="item-list-tabs" and then change the class & remove the ID from the first LI element. That should do the trick.

Conclusion

Creating custom BuddyPress directory is really easy once you understand the WordPress Plugin API. We could filter the members by changing the SQL Query directly since we also have filters for that. But that could be another tutorial. If you would like to see it, just tell me in the comments below.

Have you ever worked with BuddyPress? Be sure to share your experience below.

Want to learn more about WordPress Development? I have a course that you might want: Become a WordPress Developer.

Become a Sponsor

Posted by Igor Benic

Web Developer who mainly uses WordPress for projects. Working on various project through Codeable & Toptal. Author of several ebooks at https://leanpub.com/u/igorbenic.

7 Comments

  1. I would be interested in seeing how to filter the SQL query.

    Reply

    1. Hi Damien, I have written another article on that topic here: https://www.ibenic.com/change-buddypress-user-query-sql/

      Reply

  2. Hi Benic,
    I am a newbie to WordPress. I had this buddypress site for student. I have this for a school project.

    I have the same idea as you have here, we want visitors to see who are the administators of the site. However, wonder how you save this files on the server. Did you upload it directly in the ChildTheme/BuddyPress/members as admin_tab.php, filter.php,member_list.php, only_admin_ids.php?

    Reply

  3. Invaluable…

    This information is invaluable, I am so impressed with the type of person who passes on their skills and expertise, just to help us improve.

    Thank you so much…
    Ric

    Reply

  4. Thank you for the tutorial.
    Can you offer a code snippet or something to be able to have a separate tab by Member Types.
    There is a free plugin called BuddyPress Member Type Generator – which creates these Member Types.

    Reply

  5. Hey!
    Thanks for this helpful tutorial!
    Unfortunately I couldn’t get it to work with buddyboss/their template.

    This document implies they made a new hook for it which would I assume catch the depreciated hook but it doesn’t seem to be taking.

    https://www.buddyboss.com/resources/reference/functions/bp_nouveau_get_members_directory_nav_items/

    // Check for the deprecated hook :
    $extra_nav_items = bp_nouveau_parse_hooked_dir_nav( ‘bp_members_directory_member_types’, ‘members’, 20 );
    if ( ! empty( $extra_nav_items ) ) {
    $nav_items = array_merge( $nav_items, $extra_nav_items );
    }
    /**
    * Use this filter to introduce your custom nav items for the members directory.
    *
    * @since BuddyPress 3.0.0
    *
    * @param array $nav_items The list of the members directory nav items.
    */
    return apply_filters( ‘bp_nouveau_get_members_directory_nav_items’, $nav_items );
    }

    I noticed they’re not using button’s in their code and the array is a little different, so I tried to make function bp_my_administrators_tab() just return a similar looking array to no effect. I’m no expert in this aha

    Reply

Leave a reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.