Après que plusieurs personnes aient demandé la prise en charge de Gravatar dans les commentaires du thème populaire Choice de WordPress, j’ai décidé de me pencher plus attentivement sur la question. Je suis tombé sur cet excellent article de HackWordPress qui vous donne un petit extrait de code pour ajouter les Gravatars à votre boucle de commentaires. Depuis, j’ai ajouté la prise en charge de Gravatar à tous les thèmes ici, simplement parce que c’est si simple à faire. Dans ce guide, je vais vous montrer comment j’intègre les Gravatars dans les thèmes.
Avant de continuer, veuillez comprendre que ce guide est écrit pour WordPress 2.5 et plus. Le code présenté ne fonctionnera pas dans les versions précédentes.
Le code Gravatar
Il suffit d’insérer le code suivant dans votre boucle de commentaires pour qu’il fonctionne, mais il ne sera probablement pas très beau tel quel.
<?php if(function_exists('get_avatar')) { echo get_avatar($comment, '50') ; } ?>
En gros, ce code va vérifier si vous avez la fonction get_avatar (native à WordPress 2.5), puis afficher l’avatar du commentateur dans un carré de 50px.
Utiliser une règle
Si vous voulez vous assurer que vos Gravatars ont une taille appropriée, je vous recommande l’extension Firefox MeasureIt. Elle vous aidera à mesurer une zone de votre thème pour déterminer la bonne taille des Gravatars.
Où placer le code ?
Dans le thème Choice, j’ai trouvé que 40 était une bonne taille. Où ai-je donc placé ce code exactement ?
N’importe où dans les boucles foreach et endforeach (la boucle de commentaires), cela fonctionnera.
Styliser vos Gravatars
Une fois les Gravatars affichés dans votre modèle de commentaires, vous voudrez probablement les styliser également. Vous remarquerez que le code Gravatar crache la classe “avatar” sur chaque image. Ajoutons une ligne à la feuille de style CSS pour faire flotter cette classe à gauche et ajouter une petite marge à droite.
img.avatar {float:left ; margin-right:5px;}
Et voilà, vous avez de jolies Gravatars, parfaitement dimensionnées et stylisées. Bien sûr, les thèmes diffèrent, vous pouvez les styliser comme vous le souhaitez.
Conclusion
Rappelez-vous que ce code ne fonctionne que sur WordPress 2.5 et plus. La balise conditionnelle function_exists fera en sorte que votre thème ne se brise pas, mais rien ne s’affichera dans les versions antérieures. Plus d’informations sur d’autres méthodes d’utilisation des Gravatars sont détaillées sur le Codex de WordPress.
Si vous venez de lire cet article et que vous n’avez aucune idée de ce qu’est un Gravatar, je vous suggère de lire d’abord cet article de Lorelle sur WordPress. Il explique comment obtenir votre propre Gravatar en vous inscrivant sur Gravatar.com et comment utiliser les Gravatars sur les anciennes versions de WordPress avec des plugins.
Non seulement les Gravatars peuvent être utilisés pour les commentaires, mais ils peuvent également être ajoutés aux articles individuels des auteurs.
Si vous avez apprécié cet article, n’hésitez pas à le commenter et à le partager. J’aimerais connaître votre avis. Abonnez-vous au flux pour les dernières mises à jour de Theme Lab.
[…] Comments with Gravatar support […]
[…] Add Gravatar Support to Your WordPress Comments (tags: wordpress gravatar Tags: Daily Links, design links, links Posted under: Daily Links Subscribe to this feed […]
[…] by myself. This theme has all the normal features of a blog theme here at Theme Lab, including Gravatar support for comments, a widget-ready sidebar, and native WordPress tag support. This theme also 125×125 ad […]
[…] Updates like these just get you all excited to try and make use of the features, full avatar support as well for commenters across both gravatar, identicon and monsterID. Been dying to implement the avatar feature on the company blog for sometime, and this will be the perfect time. For those wanting to add it as well, found a great writeup this morning on how to enable the feature with some very basic PHP changes here, Gravatar Support. […]
[…] Soul, integrated into a WordPress theme. This one has all the usual features, including native Gravatar support (WordPress 2.5+ only), tagging support, and a widget-ready sidebar. It also has a special homepage […]
interesting, I’m facing the gravatar issues right now, it fixed well in my mozilla browser but turn ugly on IE7..
Thanks a lot. I tried some other codes offered around the web, this one was the one that worked exactly as I needed!
Thanks!!!
Thank you! You explained it very easily.
Thanks!
Thanks for the help!
wow, thanks for the tutorial 😀
i was wandering the net for this, thanks
[…] Add Gravatar Support to Your WordPress Comments | Theme […]
Muchas gracias por el articulo.
[…] hemos visto en ThemeLab SHARETHIS.addEntry({ title: “Soporte de gravatar en wordpress”, url: […]
[…] THEMELAB: “Add Gravatar Support to Your WordPress Comments” […]
[…] THEMELAB: “Add Gravatar Support to Your WordPress Comments” […]
[…] Visit Tutorial […]
Oh, that is good, you implemented gr avatars. They look good.
@Leland: Thanks for the comment, it was very nice of you.
@Banago, left you a comment on your blog. 🙂
About Gravatars on Theme Lab, I’ll add those soon enough.
@Leland: Thanks for your feedback, I really appreciate that. I would love it if you posted a commet at my blog as not everybody had done so 🙁
Second: When do you intend to implement gravatars at your blog? 🙂
Thanks for the tips…
Hope to enable in my theme verysoon….
some themes now coming with buid-in gravatar support such as mistylook! 🙂
Great post Leland!
I’m a huge supporter of Gravatars, so I love seeing more theme designers add built-in Gravatar support.
Like you said, it really is that easy to do!
@Banago: Nice, I like it. Thanks for commenting.
I have implemented gravatars at the theme of my blog. In fact I was about to ask for a feedback about my new design. I would love your feedback. Thanks!