GET FRESH CONTENTS FROM WPCRONS

How To Resize Gravatar Image In WordPress

Is your Gravatar image is looking blurry and small? Then you just need to resize Gravatar image before it leaves a bad impression on your users.

Hi Guys, I am Iqbal. In this article, I will show you how to resize Gravatar image in WordPress.

How to resize gravatar image in wordpress

What is a Gravatar?

When browsing different websites, you will notice that a lot of users have an image next to their name. Mainly, in the comments section. These photos square measure images known as “avatars.” But WordPress uses a particular form of avatar known as “Gravatars”–short for “Globally Recognized Avatar.” not like normal avatars, Gravatars follow you round the internet technology. That means, you just need to upload your image only one time and if you comment on other WordPress powered website it will automatically display your image there.

Why do you need to resize Gravatar image?

By default, in most of the wordpress themes, Gravatar image size is 32 x 32 (in pixels). But the theme calls it with CSS value of 48px. This is the reason why your Gravatar looks blurry. Any image will become blurry if you display it in a size which is more bigger then the actual size of the image.

Steps to resize Gravatar image –

The first thing you need to do is open the comments.php file which is located in your themes folder.  You can your cPanel or FTP to edit it. You will find it here:
public_html » wp-content » themes » your theme » comments.php

resize Gravatar Image Size comment file

Open it and navigate to class=” comment-list” section and add ‘avatar_size’ => 60, as shown in the image below. If it already present then you just need to change the dimension to 60.

resize Gvatar Image comment edit

Go ahead and save changes. Now you need to edit your CSS so that browsers can display Gravatar in 60px, not in 48px

Now open a post that has comments. Then right-click on the Gravatar in your browser and click Inspect Element.

resize gravatar image CSS

It is still showing 32×32 because of our browser cache. Now copy the CSS rule i.e. .comment-author .avatar  and replace width to 60px. Then store it in your text editor.  You will need it later.

Optional: Again select class=”comment-author vacrd” and replace the padding-left to 75px. So that it looks beautifull.

Resize gravatar image css 2

Finally, copy the two CSS rules and paste in your additional CSS section, To do this navigate to your wordpress dashboard and Goto Appearance » Customize » Additional CSS

Resize gravatar image publish 2018

And, click on publish to make changes. Finally, you need to clear the cache using your caching plugin.

Hope this article helped you to resize gravatar image on your WordPress.

If you liked this article, then please follow us on social media and don’t forget to Subscribe to our mail list. That’s all in this article. Peace!

You May Also Like

About the Author: WPC Staff

WPCrons staff has long-term experience of WordPress & like to constantly spot problems and plotting how to solve them. We believe you don't need to be a nerd or a programmer or a network engineer to make a difference.

Leave a Reply

Thanks for choosing to leave a reply. Your opinions and comments are very important to us, and your email address will NOT be published. If you need a private conversation then use our contact form. Please add an avatar if you do not have and make the comment section more beautiful.

FollowUs

Subscribe to get FREE updates

 

wpcrons-newslater
Join 1000s of readers around the globe. Don’t worry. We also don’t like Spam. We are weekly.

Subscribe to get FREE updates

 

wpcrons-newslater
Join 1000s of readers around the globe. Don’t worry. We also don’t like Spam. We are weekly.