How to set Gravatar as background image in Wordpress?

Question

I am working on a custom WordPress theme and as per design requirements, I have to set the Author Gravatar in the background of a image.

I have tried using get_avatar_url() with wp_get_attachment_image_src as below, but could not achieve:

PHP in-line code:

<?php $thumb = wp_get_attachment_image_src(get_avatar_url($post->ID), '80'); ?>

<div class="author" style="background-image: url('<?php echo $thumb[0]; ?>')"></div>

CSS:

.author {
width:120px;
height:120px;
background: no-repeat center;
}

How do I achieve this ?

Answer 1

I have found the answer in here (https://stackoverflow.com/a/29860844/3725816):

function my_gravatar_url() { // Get user email
$user_email = get_the_author_meta('user_email');
// Convert email into md5 hash and set image size to 80 px
$user_gravatar_url = 'http://www.gravatar.com/avatar/' . md5($user_email) . '?s=120';
echo $user_gravatar_url;
}


<div class="author" style="background: url('<?php echo my_gravatar_url(); ?>') center center no-repeat; top: 50%; left: 50%;">
</div>           

Answer 2

Here's the solution. It's working fine in my website.

<div 
    style = "background-image: 
                url('<?php echo get_avatar_url(get_the_author_meta('ID'), array("size"=>450)); ?>'); 
            height: 450px; 
            width:450px">
</div>