X

Adicionar suporte ao Gravatar em seus comentários do WordPress

Depois que algumas pessoas solicitaram suporte ao Gravatar nos comentários do popular tema Choice do WordPress, decidi dar uma olhada com mais atenção. Deparei-me com esta excelente publicação do HackWordPress, que fornece um pequeno trecho de código para adicionar Gravatares ao loop de comentários. Desde então, tenho adicionado suporte ao Gravatar a todos os temas aqui, simplesmente porque é muito simples de fazer. Neste guia, mostrarei exatamente como integro o Gravatars aos temas.

Antes de continuar, entenda que este guia foi escrito somente para o WordPress 2.5 e superior. O código apresentado não funcionará em versões anteriores.

O código do Gravatar

O simples fato de inserir o código a seguir em seu loop de comentários funcionará, mas provavelmente não terá uma aparência muito boa como está.
<?php if(function_exists('get_avatar')) { echo get_avatar($comment, '50'); } ?>

Basicamente, esse código verificará se você tem o get_avatar (nativo do WordPress 2.5) e, em seguida, exibirá o avatar do comentarista em um quadrado de 50px.

Use uma régua

Se quiser ter certeza de que seus gravatares estão em um tamanho adequado, recomendo a extensão MeasureIt Firefox. Isso o ajudará a medir uma área em seu tema para determinar um bom tamanho para os Gravatars.

Onde colocar o código?

No tema Choice, descobri que 40 era um bom tamanho. Então, onde coloquei esse código exatamente?

Choice Gravatar Location

Qualquer lugar dentro do foreach e endforeach (o loop de comentários) funcionará.

Como estilizar seus gravatares

Depois que os Gravatares forem exibidos no modelo de comentários, você provavelmente desejará estilizá-los também. Você notará que o código do Gravatar exibe a classe “avatar” em cada imagem. Vamos adicionar uma linha à folha de estilo CSS para que ela flutue à esquerda e adicione uma pequena margem direita.

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

Pronto, você tem gravatares bonitos, de tamanho perfeito e estilizados. É claro que os temas serão diferentes, você pode estilizá-los como quiser.

Conclusão

Lembre-se de que esse código só funcionará no WordPress 2.5 e superior. A tag condicional function_exists fará com que seu tema não seja interrompido, mas nada aparecerá nas versões anteriores. Mais informações sobre outros métodos de uso do Gravatars estão detalhadas no WordPress Codex.

Se você acabou de ler todo este artigo e não tem a menor ideia do que é um Gravatar, sugiro que leia primeiro este artigo de Lorelle no WordPress. Ele aborda os conceitos básicos de como obter seu próprio Gravatar inscrevendo-se no Gravatar.com e também como usar Gravatars em versões mais antigas do WordPress com plug-ins.

Os Gravatares podem ser usados não apenas para comentários, mas também podem ser adicionados às postagens individuais do autor.

Se você gostou do artigo, fique à vontade para comentar e compartilhar. Gostaria de ouvir sua opinião. Assine o feed para receber as últimas atualizações do Theme Lab.

Comentários   Deixe uma resposta

  1. Chocolate WordPress Theme Review | FreeWordpressThemes.us julho 26, 2008 em 5:34 pm

    […] Comments with Gravatar support […]

  2. Daily Design Links for 7-25-08 | Anidan Design : eco-friendly web & graphic design julho 25, 2008 em 9:40 pm

    […] Add Gravatar Support to Your WordPress Comments (tags: wordpress gravatar Tags: Daily Links, design links, links Posted under: Daily Links  Subscribe to this feed […]

  3. » SimpleWP - Free WordPress Theme ThemeHook: ??? WordPress Blog julho 24, 2008 em 11:57 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 […]

  4. WordPress 2.6 Released - some new features - More than just work?! julho 17, 2008 em 12:50 pm

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

  5. iGraphiX Blog | RS10 - Free WordPress Theme julho 9, 2008 em 9:09 am

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

  6. interesting, I’m facing the gravatar issues right now, it fixed well in my mozilla browser but turn ugly on IE7..

  7. Thanks a lot. I tried some other codes offered around the web, this one was the one that worked exactly as I needed!

    Thanks!!!

  8. Thank you! You explained it very easily.

  9. Thanks!

  10. Limited Edition iPhone junho 19, 2008 em 7:55 am

    Thanks for the help!

  11. wow, thanks for the tutorial 😀

    i was wandering the net for this, thanks

  12. Adding Gravatar Support to your Wordpress Comments | The Second Press junho 2, 2008 em 11:40 am

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

  13. Muchas gracias por el articulo.

  14. PixelCSS : Soporte de gravatar en wordpress junho 1, 2008 em 6:29 am

    […] hemos visto en ThemeLab SHARETHIS.addEntry({ title: “Soporte de gravatar en wordpress”, url: […]

  15. ArsGeek » Wordpress Comment Styling Round Up maio 31, 2008 em 6:52 am

    […] THEMELAB: “Add Gravatar Support to Your WordPress Comments” […]

  16. Wordpress Comment Styling Round Up maio 30, 2008 em 5:35 pm

    […] THEMELAB: “Add Gravatar Support to Your WordPress Comments” […]

  17. WPZOOM ›› Best Resources for WordPress - Round 1 maio 23, 2008 em 4:53 am

    […] Visit Tutorial […]

  18. Oh, that is good, you implemented gr avatars. They look good.

  19. @Leland: Thanks for the comment, it was very nice of you.

  20. @Banago, left you a comment on your blog. 🙂

    About Gravatars on Theme Lab, I’ll add those soon enough.

  21. @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? 🙂

  22. Thanks for the tips…
    Hope to enable in my theme verysoon….
    some themes now coming with buid-in gravatar support such as mistylook! 🙂

  23. 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!

  24. @Banago: Nice, I like it. Thanks for commenting.

  25. 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!

Adicionar um comentário

Ficamos felizes por você ter optado por deixar um comentário. Lembre-se de que todos os comentários são moderados de acordo com nossa política de privacidade, e todos os links são nofollow. NÃO use palavras-chave no campo do nome. Vamos ter uma conversa pessoal e significativa.

WordPress Launch Checklist

A lista de verificação definitiva para o lançamento do WordPress

Compilamos todos os itens essenciais da lista de verificação para o lançamento de seu próximo site WordPress em um ebook prático.
Sim, envie-me o livro eletrônico gratuito grátis!