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. 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 maio 20, 2010 em 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 outubro 19, 2009 em 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 julho 8, 2009 em 5:00 am

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

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

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

  16. Gravatars Enabled - Your Search Advisor Blog julho 2, 2009 em 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 maio 19, 2009 em 9:58 am

    Really effective, I was looking for this. Thanks.

  19. Add New Post | scream out maio 2, 2009 em 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 […]

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!