Back to blog

3 ways to add author’s image in WordPress

Add author’s image in WordPress without a plugin

WordPress uses Gravatar online service to show the picture of authors and users, this is why there isn’t a setting field to fill in with the image of the user, but you have to go to Gravatar site and upload a picture there.

Sometimes users don’t want to upload their avatar to Gravatar service, so you have to deal with users and authors without a profile picture. In this article we will try to use also an avatar generator to deal with missing profile pictures.

So here are 3 possible workarounds to change user avatar in WordPress:

Add an image in media library and use that image with get_avatar

You can add an image in media library, add a field in the edit user page to receive the address of the picture uploaded and hook the get_avatar function to use that new user field for the image. If the image hasn’t been uploaded fall back on normal get_avatar function. You can do all these things by adding this piece of code to your functions.php file:

add_filter( 'get_avatar','get_local_avatar' , 10, 5 );

function get_local_avatar($avatar, $author, $size, $default, $alt) {
  // ------------------------------------
  // handle user passed by email or by id
  if(stristr($author,"@")) $autore = get_user_by('email', $author);
    else $autore = get_user_by('ID', $author);

  $url = get_the_author_meta( 'userpicprofile', $autore->ID);
  if($url) {
    return "<img class='avatar' alt=\"".$alt."\" src='".$url."' width='".$size."' />";
  } else {
    return $avatar;
  }
}
// --------------------------------------
// add the field in your user edit profile page
function add_author_image( $contactmethods ) {
  $contactmethods['userpicprofile'] = 'URL for profile image';
  return $contactmethods;
}
add_filter('user_contactmethods','add_author_image',10,1);

Modify the get_avatar method to use another automatic generated avatar from Flathash

Flathash is a nice free service that provides flat avatars generated with an algorithm. They are always different if you send a different parameter string to generate the avatar. So you can use the WordPress user name to generate a different avatar for each user. Here is the code to add in your functions.php file to generate fresh new avatars for your users:

add_filter( 'get_avatar','get_flathash_avatar' , 10, 5 );
function get_flathash_avatar($avatar, $author, $size, $default, $alt) {
  // -------------------------------------------
  // handle user passed by email or by id or comment obj
  if(isset($author->comment_ID)){
    $code = $author->comment_author_email;
  } else {
    if(stristr($author,"@")) $code = $autore;
      else {
        $autore = get_user_by('ID', $author);
        $code =$autore->user_email;
      }
  }

  // use flathash avatar instead of gravatar
  $avatar = "http://flathash.com/". md5($code);

  return "<img class='avatar' alt=\"".$alt."\" src='".$avatar."' width='".$size."' />";
}

Create a dedicated dir in wp-content to store the authors’ images

You can create a new folder in your /wp-content dir, so you have /wp-content/authors/ folder.
You can put in this directory all the images of your authors, named with the user nice name, so, if you have a user named “barack obama” and its author url is http://www.yoursite.com/author/barack-obama, then the nice name is barack-obama, and its jpg file will be barack-obama.jpg.

You can then add this code to your functions.php to modify the get_avatar method to first search the author image file from your new wp-content authors directory and use Gravatar service only if you can’t find the image in the local content folder:

add_filter( 'get_avatar','get_content_avatar' , 10, 5 );
function get_content_avatar( $avatar, $author, $size, $default, $alt) {
  // ------------------------------------
  // handle user passed by email or by id
  if(stristr($author,"@")) $autore = get_user_by('email', $author);
    else $autore = get_user_by('ID', $author);

  // use file with author nice name jpg in /wp-content/authors/ folder
  if(isset($autore->user_nicename) && file_exists(WP_CONTENT_DIR . '/authors/'.$autore->user_nicename.".jpg")) {

    $avatar = content_url() . '/authors/'.$autore->user_nicename.".jpg";
  } else {
    return $avatar;
  }
}

It’s also possible to make a mix of these methods, for example, use a local folder to search for user pics and, if not found, use the Flathash generated avatar instead of the Gravatar one.

Canonical URL