3 ways to add author’s image in WordPress

Add author’s image in WordPress without a plugin

Aprile 5, 2017

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.

Author

PHP expert. Wordpress plugin and theme developer. Father, Maker, Arduino and ESP8266 enthusiast.

Recommended

A new avatar generator for WordPress with get_avatar and Flathash

Brand new avatars for WordPress Gravatar service

Aprile 7, 2017

WP Gutenberg notes

Collection of notes and thoughts on Wordpress Gutenberg blocks development.

Gennaio 9, 2023

Test page for Bright Links plugin

To test the plugin hover your mouse to a link, or tap the link on mobile device.

Dicembre 4, 2022

Updating a metabox after Gutenberg updates

When press on "Update" refresh a custom metabox under gutenberg editor.

WP doesn’t send email? try this

Snippets for sending emails with Wordpress

Febbraio 8, 2020

Two post types share the same taxonomy in WordPress

Sharing a WordPress taxonomy between two post types is useful especially if you want to create a relation between different…

Novembre 14, 2019