Why don’t people know about Gravatar to change this? Is WordPress not doing enough to educate other blog admin’s? Should there be a warning message in the admin/user panel and make it a requirement to set up a Gravatar image before being allowed to do anything else on the blog or even submit a comment? Currently we have 7 ugly ways to display images if someone has no Gravatar image selected.
Have you ever wanted to add your own custom image? Well you are in the right place at the right time. Now you will be able to create yourself a custom image or even resize your logo to use. Time to get creative with how you will display a default avatar image in the comment area. This is a small detail people tend to neglect but takes a few minutes to accomplish. For additional comment system tweaks, do take a look at the: 5 Simple Codes To Customize Your Theme After Installation tutorial.
Just imagine if you blog get’s on average about 10 to 20 comments per blog post and on average about 5 people have your WordPress ugly default image showing, it just looks bad in my opinion and using a custom image just ads that professional touch. Using your logo image is a great way to brand that logo of yours anyways. Does this even bother you that you are limited in the choice of comment images? We now have a solution and it’s a simple process to implement. I got fed up and I don’t think Automattic will ever improve this default comment feature so I took action. The code below works for the Genesis Framework themes and should work on blogs not running this framework. At the end of this blog post, I’ll share a way to change the default avatar for blogs not running off the framework.
I did not bother to check to see if there was a WordPress plugin to do this but I’d rather not install a plugin when a few lines of code can do the job. Follow the guide below after you backup your blog first. Find a list of backup plugins listed here.
The Image Size & Name
In order for the code to work flawlessly, it needs to be named exactly as what I mention below. The Image size that I made my logo was 80px by 80px and you should do the same thing so you get to see how this looks as soon as you complete the very last step in a bit.
Save that image file as:
custom-avatar.png
Don’t save the image as: bumblebeetuna.png
The image will not work with the code below and I don’t need to provide support on this code with you because there is no need to if these instructions are followed correctly.
Uploading The Image To A Certain Location
This step is crucial that you upload the image in the right location or the code will not be able to pull that image and you will not be able to select that new image in your admin dashboard.
This image needs to be uploaded to your themes Image folder in which involves logging in through your web hosting cpanel to your FTP account. Upload the image to your theme’s “Image” folder. To make this as simple as possible to understand, I have uploaded several images covering all questions that might be in your head. I hope you know what the name of your theme is called. Do not upload the image through your WordPress dashboard because it will never ever work in the code below.
Finding your theme file location via. FTP
Some hints below:
Adding The Avatar Code
Now that you have uploaded your image that is 80px by 80px and saved the image as the specified name I mentioned earlier in the correct image directory, just copy and paste the code below and paste it at the very bottom of your Functions.php file. Hit save afterwords and then the last step is the easiest one to enable the image on your blog’s comment system.
add_filter( 'avatar_defaults', 'custom_avatar' );
function custom_avatar($avatar_defaults){
$custom_avatar = get_stylesheet_directory_uri() . '/images/custom-avatar.png';
$avatar_defaults[$custom_avatar] = "My Default Avatar";
return $avatar_defaults;
}
Putting The New Avatar Into Action
Just select your image and hit save to now showcase your new default avatar for the blog commenters who have not set up there gravatar account. (Navigate to discussion page)
Here is an example of WPOutcast’s default image:
Important Advice To Remember
Always backup your blog before you edit any line of code, install a theme or update a plugin. This is 1 thing that you need to drill into your head. Trust me, this extra step each day could potentially one day save you hours and hours of time. Most web hosts have free backup options on your cpanel or custom hosting panel. Check to see if you have an option before looking for a free WordPress backup plugin to use.
Changing Default Comment Avatar Non Genesis Framework
If your blog does not run off the framework then the instructions below will work for you.
First things first, save your avatar image as wpb-default-gravatar.png and upload this through your “media” section in your WordPress admin panel. Don’t close this window just yet as we will need the uploaded Image URL to add inside the code.
Open up your functions.php file and place this code at the bottom. Replace the IMAGE URL with your URL from the media library
add_filter( 'avatar_defaults', 'wpb_new_gravatar' );
function wpb_new_gravatar ($avatar_defaults) {
$myavatar = 'https://www.domain.com/wp-content/uploads/wpb-default-gravatar.png';
$avatar_defaults[$myavatar] = "Default Gravatar";
return $avatar_defaults;
}Save changes and go to the discussion page and select the default avatar like shown above in the Genesis Framework Settings.
If you have found this tutorial helpful, please consider sharing it online with your followers.
Leave a Reply