Check If A User Or Author Has Avatar In WordPress And Set User Image With First Letter As Default

Imran Sayed
4 min readDec 27, 2021

Sometimes we do not want WordPress to display the default avatar. There isn’t a WP core function to check that. So we will create one. We will also learn how to add the first letters of the user’s first name and last name as a fallback avatar picture using JavaScript.

Steps to achieve the goal:

There are two things we need to check, If the user has uploaded the gravatar from:
1. WP Dashboard (using wp-user-avatar plugin), or
2. Gravatar site.

If any of the above conditions is true, the user has valid gravatar,
and the function will return true.

1. For Scenario 1: Upload from WP Dashboard:
We check if the query args are present or not.

2. For Scenario 2: Upload on Gravatar site:
When constructing the URL, use the parameter d=404.
This will cause Gravatar to return a 404 error rather than an image if the user hasn’t set a picture.

Create Custom has_avatar function

Let’s create a function and add it in functions.php

* Checks to see if the specified user id has a uploaded the image via wp_admin.
@return bool Whether or not the user has a gravatar
function is_uploaded_via_wp_admin( $gravatar_url ) {

$parsed_url = wp_parse_url( $gravatar_url );

$query_args = ! empty( $parsed_url['query'] ) ? $parsed_url['query'] : '';

// If query args is empty means, user has uploaded gravatar.
return empty( $query_args );


Let’s print_r($parsed_url) and see the difference in the URL, when an avatar is uploaded using plugin, and when it’s not.

Avatar uploaded from admin:

Avatar not uploaded:

Notice there is a query key available when an avatar is not uploaded.

Now let’s create another has_gravatar() function which in turn calls the is_uploaded_via_wp_admin() function.

function has_gravatar( $user_email ) {

$gravatar_url = get_avatar_url( $user_email );
// 1. Check if uploaded from WP Dashboard.
if ( is_uploaded_via_wp_admin( $gravatar_url ) ) {
return true;
// 2. Check if uploaded from gravatar site by adding 404 in the url query param
$gravatar_url = sprintf( '%s&d=404', $gravatar_url );

// Make a request to $gravatar_url and get the header
$headers = @get_headers( $gravatar_url );

// If request status is 200, which means user has uploaded the avatar on gravatar ste
return preg_match( "|200|", $headers[0] );

Logic: When constructing the URL, we add the parameter d=404. This causes gravatar to return a 404 error status rather than an image with 200 status if the user hasn’t set a picture.

Notice when the user has uploaded the gravatar on the gravatar site, the status is 200 vs when it’s not it’s 404

Gravatar uploaded
Gravatar not uploaded

Using has_avatar()

Now you can use this function to conditionally render the gravatar. In author.php archive page.

$author_email = get_the_author_meta( 'user_email' );
$has_avatar = has_gravatar( $author_email );
$avatar = get_avatar( $author_email, 251, '', '', ['class' => 'w-251px h-251px object-cover rounded-full'] );
if ( !empty( $has_avatar ) ) {
echo wp_kses_post($avatar);
} else {
'<span id="author-firstname" class="hidden">%1$s</span><span id="author-lastname" class="hidden">%2$s</span><div id="author-profile-img" class="w-251px h-251px object-cover rounded-full bg-brand-yellow relative"><span class="text-6xl font-lato-bold tracking-0.5px text-white inset-center"></span></div>',
esc_html( get_the_author_meta( 'first_name', $author_id ) ),
esc_html( get_the_author_meta( 'last_name', $author_id ) )

You can also add JavaScript to show the initial two letters from JS if the author's gravatar is not present like so:

( function( $ ) {
class Author {
constructor() {
this.authorProfileImgContainer = $( '#author-profile-img span' );
this.authorFirstNameText = $( '#author-firstname' ).text();
this.authorLastNameText = $( '#author-lastname' ).text();


init() {
if ( ! this.authorProfileImgContainer.length ) {
return null;

let initials = this.authorFirstNameText.charAt( 0 ) + this.authorLastNameText.charAt( 0 );
initials = initials ? initials : 'A';

// Set the text.
this.authorProfileImgContainer.text( initials );


new Author();
} )( jQuery );

Display the initials of the author Emma Watson i.e ES, when gravatar is not present.

That’s all folks!



Imran Sayed

👤 Full Stack Developer at rtCamp, Speaker, Blogger, YouTuber, Wordpress, React, Node, Laravel Developer