{"id":95242,"date":"2012-08-27T17:20:59","date_gmt":"2012-08-27T21:20:59","guid":{"rendered":"http:\/\/wpmu.org\/?p=95242"},"modified":"2013-04-15T15:48:49","modified_gmt":"2013-04-15T19:48:49","slug":"how-to-change-the-default-buddypress-avatar-sizes","status":"publish","type":"post","link":"https:\/\/wpmudev.com\/blog\/how-to-change-the-default-buddypress-avatar-sizes\/","title":{"rendered":"How to Change the Default BuddyPress Avatar Sizes"},"content":{"rendered":"

If you want to totally customize your BuddyPress community, at some point you’ll probably be interested in changing the default avatar sizes. BuddyPress avatars are nicely sized for the default theme, but your custom theme might benefit from sizing up or down from there.<\/p>\n

The two most often used default avatars are the thumbnail and the full size, which are 50px and 150px respectively. They basically look like this in the default theme:<\/p>\n

\"Post<\/p>\n

The BuddyPress codex has a list of the avatar settings that can be easily changed using internal configuration settings<\/a>:<\/p>\n

{code type=php}
\ndefine ( ‘BP_AVATAR_THUMB_WIDTH’, 50 );
\ndefine ( ‘BP_AVATAR_THUMB_HEIGHT’, 50 );
\ndefine ( ‘BP_AVATAR_FULL_WIDTH’, 150 );
\ndefine ( ‘BP_AVATAR_FULL_HEIGHT’, 150 );<\/p>\n

Open up bp-custom.php<\/a> and add this code to change the avatars. Adjust the numbers to achieve your preferred height and width. (This is measured in pixels.) If you don’t have a bp-custom.php file set up yet, it’s very easy. Create a blank file, name it bp-custom.php<\/em> and pop this in there:<\/p>\n

{code type=php}
\n<?php
\n\/\/ hacks and mods will go here<\/p>\n

?><\/p>\n

Make sure to place this file in the wp-content\/plugins<\/strong> directory.<\/p>\n

Here’s an example of the default theme with the avatar sizes changed to 70px thumbnails and 200px full size:<\/p>\n

\"Post<\/p>\n

That’s very easy to do by simply updating those numbers in your bp-custom.php file. Play around with it until you get the sizes that you like.<\/p>\n

Additional defines you can set include the maximum width of the original avatar uploaded, the maximum file size of the original uploaded avatar, the image URL for the default avatar when a user hasn’t uploaded one, as well as the URL for the thumbnail of the default avatar:<\/p>\n

{code type=php}
\ndefine ( ‘BP_AVATAR_ORIGINAL_MAX_WIDTH’, 640 );
\ndefine ( ‘BP_AVATAR_ORIGINAL_MAX_FILESIZE’, $max_in_kb );
\ndefine ( ‘BP_AVATAR_DEFAULT’, $img_url );
\ndefine ( ‘BP_AVATAR_DEFAULT_THUMB’, $img_url );<\/p>\n

These settings can be very helpful if you don’t want users uploading massive high resolution images as avatars. A file size limit is quite common with many popular social networks, even if is an inconvenience for users to have to resize their photo to something smaller.<\/p>\n

If you have any problems or questions in resizing avatars, get in touch with us in the comments or via @wpmuorg<\/a> on Twitter. We’d be happy to help you get your new avatar sizes working.<\/p>\n","protected":false},"excerpt":{"rendered":"

Changing the default BuddyPress avatar sizes is very easy. Check out our step-by-step tutorial.<\/p>\n","protected":false},"author":4099,"featured_media":95292,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"blog_reading_time":"","wds_primary_category":0,"wds_primary_tutorials_categories":0,"footnotes":""},"categories":[235],"tags":[80],"tutorials_categories":[],"class_list":["post-95242","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-misc","tag-avatars"],"_links":{"self":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/95242","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/users\/4099"}],"replies":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/comments?post=95242"}],"version-history":[{"count":1,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/95242\/revisions"}],"predecessor-version":[{"id":216680,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/posts\/95242\/revisions\/216680"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media\/95292"}],"wp:attachment":[{"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/media?parent=95242"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/categories?post=95242"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tags?post=95242"},{"taxonomy":"tutorials_categories","embeddable":true,"href":"https:\/\/wpmudev.com\/blog\/wp-json\/wp\/v2\/tutorials_categories?post=95242"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}