BuddyDev

Using different default Avatar for BuddyPress Users based on profile fields or member type

You may be knowing how to setup a default avatar for user? If not, You can now. Here is a link to our definitive guide to BuddyPress avatars.  In this tutorial, we will be concentrating on how to use different avatars for users based on some criteria. It is kind of using multiple default avatar for users, applying proper avatar based on some criteria.

It may be a good fit for educational(teacher, student), dating(male,female) or other kind of BuddyPress sites where the user can be classified into multiple types.

Before delving further, let us quickly disable the gravatar.

Step 1:- Disable Gravatar

Well done!

What would you like to do next? Change avatar? Ok. Before we do that, we need to decide what will be the basis for the classification of users. Or in other words, what will be the criteria that we use to apply different avatars.

There are multiple possibilities but we will be dealing with two cases here:-

  • Applying different default avatar based on profile field
  • or Applying different default avatar based on Member Type
  • I am not covering role, but you can easily adapt the 2nd example for roles too.

Example 1:- Using different default avatar based on BuddyPress profile field

The example is based on following assumptions:-

  • We have a profile field named Gender (with id=32), It is just for example
  • The possible values are "Male", "Female"
  • We want to display different default avatar for Male, Female members

Here is what we are going to do:-

  • Use  http://example.com/male.png when the field is set to "Male"
  • Use http://example.com/female.png when the field is set to "Female"
  • Use http://example.com/unknown.png when the field is not set

You can extend it the way you want. If you are trying to load avatars from your theme/child theme, you should also look at get_template_directory_uri(), get_stylesheet_directory_uri() instead of hard coding the url.

Let us see another example with Member Type:-

If you are not familiar with BudyPress member types, our tutorialsBuddyPress Member Type Generator, BP Xprofile Member Type Field plugin may help.

Example:- Using different avatar based on BuddyPress User Member Types

Assumptions are important. Let us have some:)

  • We have two member types defined namely "male", "female"
  • "male", "female" are the unique member type names. You can use any label for them
  • We want to display different default avatar for male/female members.
  • A user may not have a member type associated or may have some other member type associated. In that case, we simply use another fallback image

That's enough I guess. Now here is what we will do:-

  • Use  http://example.com/male.png when the member type is "male"
  • Use http://example.com/female.png when the member type is "female"
  • Use http://example.com/unknown.png when member type is not set or not one of the above

And if you are wondering where do you put these codes, don't worry! You can put the code in bp-custom.php(in plugins directory) or the functions.php of your theme.

People forget easily, I hope you are not like that. Still reminding again, don't forget the code from first step. That's all. have fun 🙂

8 Responses to Using different default Avatar for BuddyPress Users based on profile fields or member type

  • Hi Brajesh,
    Once again, you are the first stop when looking for Buddypress answers.
    Thanks for this. It will come in handy.
    Cheers,
    Allan

  • Jim #

    Can I ask what page this code is being placed on?

    It is not working for me on functions.php

  • Hello ! Is it possible to create a default avatar by membership level ? Thans a lot !

  • Hello ! Thank you for this page. I created types and used you code to add custom avatar by type. But it doesn't work. I created a bp-custom.php file in the Buddypress repertory. I added this code into this file:

    Would you say me what is wrong ?
    Thank you very much for your help !

    • Hi Halloy,
      You will need to create the bp-custom.php in your wp-content/plugins directory or you can put the code in your theme's functions.php too.

      Regards
      Brajesh

      • CDS #

        Hi Brajesh ! thanks for your reply ! If I undertand well, the bp-custom.php must be directly in the plugins directory ? Not in the budypress directory ? If I do that, the website is in 500 error.. So I tried with functions.php. But nothing happend. Would you say me what is wrong ? I created 3 types of member : classique, premium and jeunepro. With 3 images.The code is followinf. Added at the end of funciuns.php

        Thanks a lot !!!

        • Hi CDS,
          Thank you.

          1. Please make sure to change example.com with the actual url
          2. Your code seems to be missing a line

          Also, Let us continue it on the forum here.

          https://buddydev.com/support/forums/topic/custom-avatar-by-type/

          Regards
          Brajesh