When someone places a comment in WordPress, the blog tries to identify them by email. The email address is not shown on the comments, but if they happen to have a Gravatar account, their profile picture from that service will be used.
If a Gravatar is not found for that email, then a default image will be used. WP can be set up to use
- “Static” default avatars, which are shared between all anonymous commenters, and
- “Generated” default avatars, which will vary from user to user.
This configuration resides in Settings > Discussion .
You can see the difference between “Generated” and “Static”.
I wanted something similar to the “Generated” ones, but more personalized.
In order to achieve this, one can modify the behaviour of the function get_avatar(). There is two main ways:
- You can add a filter to the avatar_defaults option, and modify the “avatars array” in order to get a new “Static” default avatar option in Discussion Settings. You can see an example here.
- You can add the filter to pre_option_avatar_default , and return any URL you want.
I will use the second option, so the URL returned will be picked up randomly from a set.
|
1 2 3 4 5 6 7 8 |
// Random Chameleon Avatar add_filter( 'pre_option_avatar_default', 'chameleon_default_avatar' ); function chameleon_default_avatar ( $value ) { return admin_url( 'images' ) . '/cham_avatars/cham_avatar'.rand( 0 , 13 ).'.jpg'; } |
This will modify the regular flow WordPress uses, and return a custom random avatar. I created 14 avatars, named them cham_avatar0.jpg to cham_avatar13.jpg , and copied them into my wp_admin/images/cham_avatars folder .
The problem is that modifying the source code of WordPress directly is not ideal, because will be messed up in WP updates.
I recommend using the WordPress plugin Code Snippets for this. It helps keep your modifications organized and safe from updates, and you can easily enable or disable them.
So I followed these steps:
- installed Code Snippets
- downloaded a bunch of Creative Commons chamaeleons that I liked, and cropped them
- resized them with for i in *; do convert $i -resize 90x90 $i; done ,
- uploaded to my website’s
wp-admin/images/cham_avatars/ folder,
- pasted the code snippet, and
- hit save and enable.
It is really that simple!
That’s so helpful, thank you! I spent the whole evening figuring out how to write a plugin for that, silly me.
I love my new avatars – feel free to check out annagrunduls.com to see what I did. When you scroll down on the index page, you’ll see a product reviews tab – the comments all have illustrated avatars now, thanks to you! 🙂
wow yeah, that looks nice! 🙂
Unfortunately the folder got wiped on the last WordPress Update…
Is there a better folder structure that wont get overwritten?
funny, that did not happen to me
Looks great but Buddypress overrides these settings with bp_core_fetch_avatar. I tried replacing “pre_option_avatar_default” with “bp_core_fetch_avatar” in your above code but it doesn’t work .
What to do in this case then ?
Mmm I have not tried it with Buddypress, sorry
NCPi is really amazing, your doing a great job.
About wordpess en NCPi. I think it is possible, should be pissible to run a wordpress website on NCPi. But how do i get this to work, also with all the security benefits that NCPi has to offer. I want my website to have ssl to. And nextcloud to be on a subdomain (mystuff.yourwebsite.com/) so the website runs on the mainsomain.
I hoop you guys can help me out, thnx
Hi,
Please, use the forums for questions and discussions
hi
Is this currently possible?
Awesome and exactly what I was looking for.
The only minor issue I could see is that when the same user reply a second or third time in the same thread he still gets assigned a random avatar.
And also avatars change after every F5…
any possible solution?. Thanks.!
thanks
This is working great, thank you!
Is it possible to add the same avatar to a user based on their email address?
Thanks for the tutorial.
Looking at the source code, the random images are being picked up but the url seems to be looking at the Gravatar website rather than my website. Is there anyway this can be turned off so it looks for the source images within the website structure?
Unless I’m missing something?