Gravatar Hovercards on WordPress.com
October 06, 2010 | Posted by Beau Lebens
You thought Gravatar Profiles were cool? Wait until you see them on all WordPress.com blogs.
Today we’re upping your Gravatar Profile to a new level of awesomeness with Gravatar Hovercards. It’s now easy to find out about who is behind your favorite comments on WordPress.com simply by moving your mouse over their Gravatar. This new feature is enabled by default across WordPress.com.
What’s a Hovercard?
Gravatar Hovercards show information about a person: name, bio, pictures, and their contact info at other services they use on the web like Twitter, Facebook or LinkedIn.
As a commenter, Hovercards offer a great way to show your Internet presence and help people find your own blog. If you’re a blogger on WordPress.com, you can quickly check out who’s commenting on your blog, and have an easier time connecting with them.
How to use and see Hovercards
You can see other people’s Hovercards by moving your mouse over their Gravatar picture in comments on any WordPress.com blog, and after a moment the Hovercard will appear. The information shown is taken directly from the person’s Gravatar profile. The more info in the profile, the more we show in the Hovercard.
If you haven’t set up your Gravatar Profile yet, just log in to Gravatar.com and fill out your details under Edit My Profile. If you don’t have an account yet, you can sign up here.
Check back soon for details on how to add hovercards to your own website, or any site currently using Gravatars.
joint
The Gravatar Hover Card is a very nice feature for wp.com thanks for the new addition…
I like the Hover Card.
I attempted to edit my profile, to more effectively use the hovercards feature, but when I click on the ‘edit profile’ link the browser closes.
We had a small bug that was causing that, which should now be fixed — please give it another shot!
Ok, not much feedback section on your main page. It would nice. Look how http://www.zoho.com and http://www.mendeley.com do.
Where is facebook connect, or any of OpenID server like google. Everybody has photos on that. Actually you should implement them all. This way you solve a problem that is for developers getting avatars from your site to don’t need to learn how to get avatar from every variety of avatars sources like facebook, google, twitter… they would get only yours. By the way, watch out if they are not standardizing the getting avatar protocol.
Cheers, good luck
This is a great new feature, Beau! Seems like it will encourage more folks to fill out their Gravatar profiles and make it easier to connect with them. I’m looking forward to the plugin so we can add it to our self-hosted WordPress sites.
[…] introduces Gravatar Hovercards: Is WordPress(.com) becoming a social network? […]
not only wordpress.com but any other site that has gravatar hovercards enabled that can be millions of sites all coming together under one comunity, this can be called an evolution of social sites. i like this much more.
This is another small but great step for WordPress(.com).
BTW: Automattic’s, I’d really like to read your answer here: http://wp.me/pcOTe-3fJ Where are you, where are we going to?
Does it also work on self-hosted blogs, or just on hosted?
This release is only for WordPress.com, but we’ll be releasing a plugin for self-hosted WordPress soon.
I found a plug-in for it in my self hosted blog back office and installed it. I activated and it doesn’t work.
However, it does work on my wordpress.com blog though.
I have two blogs, one self hosted and the other wordpress.com hosted.
This is fantastic! Can’t wait for the release of the plugin for the self-hosted WordPress blogs.
This is great, I’ll be waiting for the self-hosted plugin version
Cheers!
Je viens de cacher cette fonction, sans faire exprès, un clic au mauvais endroit, comment faut-il faire pour la remettre ?
D’autre part, il était possible il y a encore quelques jours d’avoir en pointant la souris sur une adresse blog ou d’un site, un aperçu de celui-ci. Apparemment cela a disparu. Comment peut-on le remettre ?
If you’ve clicked the “turn off hovercards” link, you need to manually delete the cookie that’s been set in your browser to re-enable them. Go into the cookies in your browser and search for cookies under the domain “wordpress.com”. Delete the one called “nohovercard”.
[…] Signup Encouragement 2.08 October 2010 Do you like new Gravatar Hovercards? Why don’t you prepare your visitors without Gravatar for the upcoming plugin with this […]
Very cool indeed. Can’t wait for the self-hosted plugin. I’ll implement this for sure.
Glad you have a ‘hover intent’ delay on there so that they don’t pop up unintentionally as your mouse moves across the page. I’d probably make the delay ever so slightly longer, but that’s me. Looking nice!
This is a really cool feature. Great job, Automattic!
Performance:
minification of JavaScript file
merging of CSS files and minification of a new file
sprite with other images, maybe even merged with services sprite
Internationalization:
It’s unbelievable that someone who have experience in development doesn’t care about i18n.
Oh, wait its Gravatar, where translators waste time on translations that are never deployed! No I understand…
(for third-party readers who think how this can be solved, instead of hardcoded strings, we need variables got from json request to locale subdomain)
Milan, it’s not (at all) that we don’t care about i18n. Quite the opposite — we are aiming to get our English-based implementations solid first, since that’s what all of our developers speak. Once that is good, then we roll out internationalization options/features. We are also going to be tuning some of the performance details you’ve pointed to above, but optimizing prematurely slows down development iterations, so we put that behind the initial launch.
[…] recently launched Hovercards, a new feature that servers as a nifty bridge between your Gravatar and your Gravatar […]
Thanks for this wonderful feature! I actually learned about this through the Weblog Tools Collection blog, where I was able to capture the code to add this feature to my self-hosted WordPress blog. Blogging about the feature to my readers right now!
http://weblogtoolscollection.com/archives/2010/10/10/add-hovercards-to-your-wordpress-blog/
Awesome guys.
Keep up the good job
[…] Gravatar Blog, Weblog Tools […]
I love it!
Waiting for the self-hosted plugin…
The Hovercard is beautiful. I’m looking forward to the plugin so I can add this great feature to my self-hosted WordPress sites. This will encourage more people to fill out their Gravatar profiles too; I certainly would update mine often.
Add another vote for the plugin. The feature is really cool!
I was wondering… Why I have to verify Flickr or Facebook?
Why you don’t just let me put the user and link there?
I’m sorry but sucks to allow access in Flickr or Facebook
Regards
You verify that this is actually your account and not from someone else.
If you just want to have links, there is section “My Links” where you can put any link you want.
Right. Thx
Some of the Gravatars are not showing Hover cards, eg: Nicholas Teo and mine. Is this a bug or something has to be enabled somewhere….
Only Primary Addresses currently resolve to Hovercards, so that might be what’s happening. We’re going to probably roll out an option so that you can pick which addresses will load your card, but that will be part of a bigger UI change on Gravatar.com
Thanks – that indeed was the problem.
Why only one of the addresses? I’d love it to apply to all if possible… it can be the same exact hovercard. Thanks.
How about this Plugin…
http://wordpress.org/extend/plugins/gravatar-wordpress-plugin/screenshots/
The hovercards are cool! Does anyone know if it’s possible to link to just the Facebook Page for my business and not to my own Facebook profile?
Right now you would need to do this via a link in the “My Links” section, since we don’t have a way to verify Page ownership just yet.
It’s realy cool. I’ll write about this on my blog
I’ve opted for secure connections, and Gravatar is apparently using an out of date certificate somewhere in its system. I get errors from time to time.
I also think it would be cool to add the icanhascheezburger sites to be verified eventualy too. They use a wordpress platform on their own sites, but they also have it where people can create a profile there, so it’s also a social networking site, as well. I think the profiles are hosted on cheezburger.com
Wow the internet just keeps getting more social.
This is a great new feature and informations to start with Gravatar.com, Fantastic !!! Seems like it will encourage more folks to fill out their Gravatar profiles and make it easier to connect with many friends. I am looking forward to the plugin so we can add it to our self-hosted WordPress sites and others…
this is a really cool service. I am right now writing a post about this service.
Cyrillic links (anchors) looks like %u0414%u0430%u0432%u043B%u0435%u043D%u0438%u0435 %u0441%u0432%u0435%u0442%u0430. %u041D%u043E%u0432%u043E%u0441%u0442%u0438 %u043A%u0443%u043B%u044C%u0442%u0443%u0440%u044B
)=
Ouch! Looks like we have an encoding bug. Can you please email support [a] gravatar.com with details on where you edited your profile, a link to your account etc and we’ll see if we can get it fixed up?
I like this,, And I implemented on My Site (not wordpress blog). Thanks. It’s great feature
Gravatar Hovercards are awesome! The promote much more visitor interaction and promote commenting. Thanks for the great feature!
well i`m new at blogging and this feature will help me go a long way thanks.
Beau – I am new to WORDPRESS and have a brand new website. Love my gravatar and just showed a media friend of mine how to set his up. I would love to change my comment section on my blog to have gravatar’s so it’s more personal. Do you know of a plugin for that? Here is a link to my blog so please let me know your thoughts: http://www.sensationalevents.com/blog-accolades
Also, I would love to introduce this as a blog post. Any interest in being a guest blogger???
Amy Petrovsky
Sensational Events
Gravatars are supported natively in WordPress (Settings > Discussion), but it’s up to your theme to actually display them. If your theme doesn’t do that, then you’d need to either modify your theme so that it does, or get a plugin like this one that injects them into the page.
I live in Thailand. Every time I try to use Gravatar the site comes up in Thai, which I can’t read. It is very frustrating. Please please please add a ‘change language’ button to the site.
My gravatar is for some reason using an old (and incorrect) link to my bog. The old link was aperspectiveonsacredliturgy.wordpress.com. I moved it to bymeansoforthodoxy.wordpress.com. However, the hovercard, when clicked, goes to aperspectiveonsacreliturgy.wordpress.com (a typo’d url that I must have mistakenly entered at some point), and I can’t find where to change it. I’ve changed the link on the wordpress profile to bymeans…, but that doesn’t seem to affect gravatar. Any help would be appreciated! I really like thia feature, however this is frustrating me.
Once a comment is made on a website, your URL/link is saved with that specific comment. Changing your link in Gravatar will not (and can not) go back and change it on all of those links I’m afraid.
I would love to use Gravatar but can’t create an account with a username that contains space. Now by looking at people using gravatar a lot are using their full name,- which includes space. Or how is it done???
Your username can’t contain spaces, but once you’ve set up an account you can change your “Display Name” to your full name (or anything else containing spaces).
Hi Beau:
I’m pretty new to the whole blogging thing and a complete Newbie to Gravatar, but I did set up my account today, uploaded my picture and got it all working. I’m very intrigued by the Hovercards and was wondering if we will ever be seeing them on stand alone WordPress sites, which is what I have?
Thanks,
Rudy
Hovercards are now available as part of the Jetpack plugin, see http://jetpack.me for more info.
Great to see this on self hosted WP blogs now.
Is there anyway to styling these to look as want them in your site? Does it use javascript?
Thanks to bring Hovercards into Jetpack package!
hi,
I was wondering how I could get hovercard work on my site??? I recently got the ‘jetpack’ plugin installed that contained this plugin but wasn’t been able to make it work on my site: elie-palima.com was wondering if you could help me out with it?? thanks.
I love the Hovercards feature! Really cool idea.
Also, seeing that we can’t add e-mail addresses and photos without losing the ability to display the hovercard for the additional ones (still don’t know why)… should we just set-up multiple Gravatar accounts, with one for each e-mail so that we can display a hovercard for each?
Just found a workaround
Go to Gravatar.com delete the secondary address
Go to wordpress.com login to your account with the same credentials you use for gravatar.
Chance your e-mail to the e-mail deleted secondary gravatar e-mail.
Confirm the change
Change it back to the primary gravatar e-mail address
Confirm the change
This releases the secondary e-mail address. (can take a while)
For me it was now possible to register a new gravatar account for the secondary address.
[…] hovers over their avatar image in the comments. You can see a live example on the WordPress.com Gravatar Blog where they first revealed the new feature. With Jetpack, you can easily turn this feature on or […]
Really nice!
Gravatar Hovercards are available in Jetack: http://jetpack.me
Hi! I love this feature and we have implemented it on our site (and first Memolane enabled WP theme at tabletracker.me)
thing is, it has some very weir behavior. Two major problems: my account displays properly, my emails the same, however… I am told that my profile link shows someone else’s! I know this because I recognize the name (its a cousin of mine who also uses the service) so, what gives? Any ideas?
Now, the other one. in the same site, my colleague cannot get this thing to work at all! In spite of having everything set properly! Er? Any idea there?
It sounds like perhaps your email is set up on a different account? And for the other one, perhaps you’re hovering over a Gravatar that’s loading from a non-primary address? Currently only the primary email address on an account will trigger the hovercard. If you email support@gravatar.com with full details (and links to examples) we can get you sorted out.
This is pretty nice. It can get even better if we can change the background and customize the CSS bit to get more integrate with our sites.
Thanks for all the excellent wordpress.com tools for webmasters.
Best Regards.
Beau,
How do I change the hover action and shape of the gravatar to that of a circle? I’m using hovercards via Jetpack.
You would need to get creative with CSS to turn your gavatars into circles. If you’re trying to change something about the hover action then you would probably have to write a custom version of our hovercards code, making use of requests to the profile data (http://en.gravatar.com/site/implement/profiles/)
nice ,,, i have plugin to install on my wp site