...

How to Change the Shape of User Avatars in WordPress

92

Ever come across a site that has custom shapes for their user avatars or gravatars? Want to add the same style on your site? In the past, we have written about how to add round avatars using CSS, but that requires tweaking code. In this article, we will show you how to change the shape of user avatars in WordPress without any HTML or CSS.

Video Tutorial

Subscribe to WPBeginner

If you don’t like the video or need more instructions, then continue reading.

First thing you need to do is install and activate the Avatar Shaper plugin.

Once you have activated the plugin, you need to go to Settings » Avatar Shaper to configure the settings.

Avatar shaper settings

The plugin comes with 10 built in shapes that you can use for your gravatar images. You can see a live preview of each shape by clicking on the select shape button.

Avatar shaper comes with the following shapes: curved square, circle, pentagon, hexagon, nonagon, heptagon, diamond, burst, and heart shaped avatars.

You can customize the styles by changing the radius settings, adding or removing shadow, modifying the shadow color, and removing the gloss optin from each of these pre-defined shapes.

In case you don’t want to use any of these, then you can always click on Custom and create your own custom shape. When creating a custom shape, you can adjust border radius to your own liking.

If you are an advanced user and want to manually add modified avatars, then you can check the custom method checkbox. By using the custom method, it allows you to manually add avatar_shaper() template tag in your theme where you want to display customized avatars. Beginners can safely ignore this setting.

Once you are done choosing the shape for your avatars, you can press the save changes button to store your settings.

That’s all. You can now visit your website and see the avatar shapes in action.

Burst shaped gravatar in comments

We hope this article helped you change the shape of user avatars in WordPress. You may also want to check out this tutorial on how to add new default avatars in WordPress.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Google+.

Seraphinite AcceleratorOptimized by Seraphinite Accelerator
Turns on site high speed to be attractive for people and search engines.