X

Añade soporte Gravatar a tus comentarios de WordPress

Después de que varias personas solicitaran soporte para Gravatar en los comentarios del popular tema Choice de WordPress, decidí investigarlo más detenidamente. Me encontré con este gran post de HackWordPress que le da un pequeño fragmento de código para añadir Gravatars a su bucle de comentarios. Desde entonces, he estado añadiendo soporte Gravatar a todos los temas aquí, sólo porque es tan fácil de hacer. En esta guía te voy a mostrar cómo exactamente integrar Gravatars en temas.

Antes de continuar, por favor entienda que esta guía está escrita sólo para WordPress 2.5 y superiores. El código no funcionará en versiones anteriores.

El código de Gravatar

Simplemente poniendo el siguiente código en tu bucle de comentarios funcionará, pero probablemente no se verá muy bien tal cual.
<?php if(function_exists('get_avatar')) { echo get_avatar($comentario, '50'); } ?>

Básicamente este código comprobará si tienes el get_avatar (nativo de WordPress 2.5), y luego mostrará el avatar del comentarista en un cuadrado de 50px.

Usar una regla

Si quieres asegurarte de que tus Gravatars tienen un tamaño adecuado, te recomiendo la extensión de Firefox MeasureIt. Esto le ayudará a medir un área en su tema para determinar un buen tamaño para Gravatars.

¿Dónde colocar el código?

En el tema Choice, encontré que 40 era un buen tamaño. Entonces, ¿dónde puse este código exactamente?

Choice Gravatar Location

En cualquier lugar dentro del foreach y endforeach (el bucle de comentarios) funcionará.

Estilizar sus Gravatars

Una vez que tengas los Gravatars mostrados en tu plantilla de comentarios, probablemente querrás darles estilo también. Notarás que el código de Gravatar escupe la clase “avatar” en cada imagen. Vamos a añadir una línea a la hoja de estilos CSS para flotar esto a la izquierda, y añadir un pequeño margen derecho.

img.avatar {float:left; margin-right:5px;}

Ahí lo tienes, tienes Gravatars de aspecto agradable, perfectamente dimensionados y con estilo. Por supuesto, los temas serán diferentes, puede darles el estilo que desee.

Conclusión

Recuerde, este código sólo funcionará en WordPress 2.5 y superior. La etiqueta condicional function_exists hará que tu tema no se rompa, pero no aparecerá nada en versiones anteriores. Encontrará más información sobre otros métodos para usar Gravatars en el Codex de WordPress.

Si acabas de leer todo este artículo y no tienes ni idea de lo que es un Gravatar, te sugiero que leas primero este otro de Lorelle en WordPress. Repasa los conceptos básicos de cómo obtener tu propio Gravatar registrándote en Gravatar.com, así como el uso de Gravatars en versiones anteriores de WordPress con plugins.

Los Gravatars no sólo se pueden utilizar para los comentarios, sino que también se pueden añadir a las entradas individuales del autor.

Si te ha gustado el artículo, no dudes en comentarlo y compartirlo. Me gustaría conocer tu opinión. Suscríbete al feed para recibir las últimas actualizaciones de Theme Lab.

Comentarios   Deja una respuesta

  1. Thaaaaaaaaaaaaaank you!!!! 🙂

  2. Wow! That helps. I been fooling around with my non premium theme for hours trying to figure that out. WordPress Codex support doesn’t help much. They don’t explain exactly where to put the code. What a relief that I found this site. Been coding since 2008 and still run into problems.

  3. Thanks, I am having some real issues getting this to work on my blog, but hopefully this will help. I am using a theme that runs on Thematic so I can find the “foreach” you mentioned but not the “endforeach” and when I added the code it didn’t work for me. I guess I will keep at!

  4. Thanks for this great how-to mate! Works just fine! Whoop whoop!

  5. Sandra Hendricks mayo 20, 2010 en 4:15 pm

    It worked like a charm! Thank you soooo much Leland for your post! Your Blog is truly a blessing to all who have WordPress! 🙂

  6. Thank you so much – worked like a charm!

  7. Your theme should contain avatar, as it’s quite standard in wordpress. If it doesn’t it’s a craooy theme, and you would be better off finding another theme. 😉

  8. Hairtransplantdoc octubre 19, 2009 en 11:18 am

    My theme doesn’t contain this loop inside comments.php, any ideas?

  9. Oh my god, at last a code, that worked… I couldn’t get the system to load the avatars, that were attached to the author emails… you’rs worked!!

    Many many thanks.

  10. Thanks, I’ve just set it up on my blog, too.

  11. Thanks a lot! This was easy 🙂

  12. nice i done with the comments
    but i want to add more info with each post about the author
    his name
    his avatar
    and bio
    my blog here http://www.eskandarany.org/blog
    how and what the CSS code to style all this new stuff

    thanks in advance 🙂

  13. Hi there,

    Useful information, I’ve now successfully integrated Gravatar into my site.

    Cheers,
    Eddie Gear

  14. Cool random avatars | Turtle Juice: Making Money Online julio 8, 2009 en 5:00 am

    […] Learn more: Using Gravatars Add Gravatar Support to Your WordPress Comments […]

  15. Add Gravatar in WordPress Comments « Ivan Teoh julio 8, 2009 en 1:59 am

    […] Add Gravatar Support to Your WordPress Comments […]

  16. Gravatars Enabled - Your Search Advisor Blog julio 2, 2009 en 7:15 am

    […] add Gravatars to your WordPress blog, download the plugin and follow these instructions. Simple! var addthis_pub = ‘RichmondWiki’; var addthis_brand = ‘Your Search Advisor’;var […]

  17. Hi man, the post is awesome. But my problem is to asociate the gravatar image to an author image in my index.php WordPress blog. I don’t know the correct sintaxis to do this. Have you any sugerence? Thanks a lot!!!

  18. Dario Gutierez mayo 19, 2009 en 9:58 am

    Really effective, I was looking for this. Thanks.

  19. Add New Post | scream out mayo 2, 2009 en 1:28 am

    […] 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 […]

Añadir un comentario

Nos alegra que haya decidido dejar un comentario. Tenga en cuenta que todos los comentarios se moderan de acuerdo con nuestra política de privacidad , y que todos los enlaces son nofollow. NO utilice palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.

WordPress Launch Checklist

La lista definitiva para lanzar WordPress

Hemos recopilado todos los elementos esenciales de la lista de comprobación para el lanzamiento de su próximo sitio web de WordPress en un práctico ebook.
Sí, envíeme el ¡gratuito!