Definitive Guide to BuddyPress Avatars
This is your ultimate guide for anything you ever wanted to know about BuddyPress Avatars.
What is an avatar?
As per Oxford dictionary,
The avatar is an icon or figure representing a particular person in a computer game, Internet forum, etc.
In case of BuddyPress, Avatars are used for user profile display photo as well as for group display photo. To be honest, BuddyPress changed the naming terminology and the avatars are now called Profile Photo, Group photo.
Here are the things we will do.
Disable BuddyPress Avatars, completely:-
1 | define( 'BP_SHOW_AVATARS', false ); |
Change the Dimensions of Avatar:-
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | if ( !defined( 'BP_AVATAR_THUMB_WIDTH' ) ) define( 'BP_AVATAR_THUMB_WIDTH', 100 ); if ( !defined( 'BP_AVATAR_THUMB_HEIGHT' ) ) define( 'BP_AVATAR_THUMB_HEIGHT', 100 ); if ( !defined( 'BP_AVATAR_FULL_WIDTH' ) ) define( 'BP_AVATAR_FULL_WIDTH', 350 ); if ( !defined( 'BP_AVATAR_FULL_HEIGHT' ) ) define( 'BP_AVATAR_FULL_HEIGHT', 350 ); if ( !defined( 'BP_AVATAR_ORIGINAL_MAX_WIDTH' ) ) define( 'BP_AVATAR_ORIGINAL_MAX_WIDTH', 600 ); |
It is not necessary to have square images. you can do what you want.
Allow larger or smaller file size for avatars:-
1 | define( 'BP_AVATAR_ORIGINAL_MAX_FILESIZE', 20000000); //in Bytes 1KB=1024B, 1MB=1024KB, ... |
Disabling Gravatar:-
1 | add_filter( 'bp_core_fetch_avatar_no_grav', '__return_true' ); |
Adding a better Default Avatar Photo:-
define the constants in your functions.php or bp-custom.php
1 | define ( 'BP_AVATAR_DEFAULT', 'http://yoursite.com/avatar.jpg' ); |
Want to set it dynamically? need to set the thumbs too?
Adding Default Avatar and Thumb too:-
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | /** * Set default fallback avatar(user photo) * @param string $avatar * @return string */ function buddydev_set_default_avatar( $avatar ) { //loading from your theme $avatar = get_template_directory_uri() . '/assets/images/avatars/user-default-avatar.png' ; return $avatar; } add_filter( 'bp_core_avatar_default', 'buddydev_set_default_avatar' ); /** * Set default fallback avatar thumb * * @param string $avatar * @return string */ function buddydev_set_default_avatar_thumb( $avatar ) { //load from your theme $avatar = get_template_directory_uri() . '/assets/images/avatars/user-default-avatar-thumb.png' ; return $avatar; } add_filter( 'bp_core_avatar_default_thumb','buddydev_set_default_avatar_thumb') ; |
Not satisfied yet. Need more control for specifying different images for user and groups. Well, Here we go:-
Specifying different default avatar for BuddyPress Groups:-
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | /** * Set the default fallback photo for groups * * @param type $avatar * @param type $params * @return string */ function buddydev_set_group_avatar( $avatar, $params ) { //$params['type'] == 'full' , show large one //Based on $params we may decide to use a thumb/full but let us not worry about that right now $avatar = get_template_directory_uri() . '/assets/images/avatars/group-default-avatar.png' ; return $avatar; } add_filter( 'bp_core_default_avatar_group', 'buddydev_set_group_avatar', 10, 2 ); |
Based on $params['type'] you may provide different images for full and thumb.
Since BuddyPress internally supports User/groups avatar and if you are using any above snippet, you don't need to do anythign extra. But in case you want to be very specific about user avatars, you can do it like this too.
Setting Default User avatar(Again):-
1 2 3 4 5 6 7 8 | function buddydev_set_user_avatar( $avatar, $params ) { //$params['type'] == 'full' , show large one //Based on $params we may decide to use a thumb/full but let us not worry about that right now $avatar = get_template_directory_uri() . '/assets/images/avatars/user-default-avatar.png' ; return $avatar; } add_filter( 'bp_core_default_avatar_user', 'buddydev_set_user_avatar', 10, 2 ); |
Just knowing a little more does not hurt.
One more thing, since it is definitive post about avatars, let us see how can you get an avatar
Fetching Avatars:-
1 | bp_core_fetch_avatar( $args ) |
Yup, That's what you will use. The $args is an associative array explained below.
Possible keys and values in comments below
1 2 3 4 5 6 7 8 9 10 11 12 | $args = array( 'item_id' => $user_id|$group_id|$blog_id, 'object' => 'user',//'user' is default, can be 'group','blog' 'type' => 'thumb',//full, thumb 'width' => false,//specify a numeric width, will be used in the width attribute 'height' => false,//specify a numeric height 'class' => 'avatar',//adda extra class to the generated avatars 'no_grav' => false, 'html' => true, //generate the img element? 'extra_attr' => '', 'force_default' => false, ); |
Make sure to provide the item_id .
Is there something that I missed about the avatars? Let me know your suggestion and how can we make it more definitive list ?