I was working on a political buddypress social network site and couldn’t find how to resize an avatar like I wanted. After searching around for a bit and not finding a quick solution on how to modify a BuddyPress avatar size, I decided I’d post the solution. What I was trying to do was modify the default BuddyPress members plugin so I could output larger vcards that looked similar to Polaroids with a members name and BuddyPress custom profile field dubbed ‘affiliation’. Here is the example where I was trying this but should be able to use this anywhere in a buddypress install where you need an avatar sized:
Open /wp-content/plugins/buddypress/bp-core/bp-core-widgets.php and look for the LI class “vcard” around line 60. Then find the php tag which outputs the avatar:
bp_member_avatar()
and add ‘type=full&width=125&height=125′ including the ticks.
bp_member_avatar(‘type=full&width=125&height=125′)
This will output a standard 35×35 avatar by default unless you changed the default somewhere else in the install. By researching the accepted parameters, found that I could set the type, height, and width. The reason I set type also was I didn’t want it using the default ‘thumb’ type of 35×35 and resizing up to 125×125 as it would look terrible.
I set the type as full so I could resize the 150×150 ‘Full’ image and not have a terrible looking picture.
bp_member_avatar(‘type=full&width=125&height=125′)
Each parameter needs to be separated with a ‘&’. That is it, change the 125 in height and width to size to your needs.
Now my political supporters look great.
I've been interested in the web since the early days of 14.4k dial up speeds and started my first blog on hacking Activision's Interstate 76 video game so I could get 4 turrets on my car (only 1 was allowed) during online multiplayer gaming. The web has come a long way since those days. Today I'm focused on helping clients achieve awesome device agnostic experiences on the web as mobile usage explodes.
One question, when doing an update of Buddy Press in the future, will this get overwritten since it’s a core file? If so, is there a way to do this on a custom sheet?
Thanks for the article.
Hi Jerry,
There is a way to do that. It is called a child theme.
Buddypress has some good documentation in their codex. Scroll to heading: (3) Overriding BuddyPress’ Template Files
BuddyPress Child Theme Template Files
Doesn’t a child theme only override template files though? How would we use a child theme to override core files?
Hi Matt you are right. What the above comment should say is add the code to your child theme’s functions.php file. @modemlooper is correct below also.
You can add code to a functions file or adda file bp-custom.php to the wp-content/plugins folder to change image sizes
Avatar specific settings can be changed:
define ( ‘BP_AVATAR_THUMB_WIDTH’, 50 );
define ( ‘BP_AVATAR_THUMB_HEIGHT’, 50 );
define ( ‘BP_AVATAR_FULL_WIDTH’, 150 );
define ( ‘BP_AVATAR_FULL_HEIGHT’, 150 );
define ( ‘BP_AVATAR_ORIGINAL_MAX_WIDTH’, 640 );
define ( ‘BP_AVATAR_ORIGINAL_MAX_FILESIZE’, $max_in_kb );
define ( ‘BP_AVATAR_DEFAULT’, $img_url );
define ( ‘BP_AVATAR_DEFAULT_THUMB’, $img_url );
Greetings! Very useful advice within this article! It’s the little changes that produce the biggest changes. Thanks a lot for sharing!
Thanks a lot!