Asynchronous Loading Gravatar Avatars - jQuery async-gravatar

File Size: 104 KB
Views Total: 814
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Asynchronous Loading Gravatar Avatars - jQuery async-gravatar

async-gravatar is a jQuery plugin that allows you to asynchronously replace placeholder images on your page with Gravatar avatar images to speed up page loading time.

How to use it:

1. Embed a placeholder image into your webpage and insert the email hash into the data-gravatar_hash attribute:

<img class="gravatar" 

2. Import jQuery JavaScript library and the jQuery async-gravatar plugin's script into the page.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.async-gravatar.min.js"></script>

3. Just call the function on the img and done.


4. Adjust the size of the avatar.

  size: 200 // default: 64

5. Decide whether or not to force using SSL(HTTPS).

  force_https: true // default: false

6. Set the default avatar when an email address has no matching Gravatar image:

  • 404
  • mm
  • identicon
  • monsterid
  • wavatar
  • retro
  • robohash
  • blank
  default_img: "mm"

7. Set the rating parameter that indicates if an avatar is appropriate for a certain audience.

  • g: display on all websites with any audience type.
  • pg: may contain rude gestures, provocatively dressed individuals, the lesser swear words, or mild violence.
  • r: may contain such things as harsh profanity, intense violence, nudity, or hard drug use.
  • x: may contain hardcore sexual imagery or extremely disturbing violence.
  rating: "g"

8. You're also allowed to passing the parameters via data attributes as follows:

<img class="gravatar" 



  • v1.1.3

This awesome jQuery plugin is developed by llaumgui. For more Advanced Usages, please check the demo page or visit the official website.