Após algumas pessoas solicitarem suporte a Gravatar nos comentários do popular tema Choice do WordPress, decidi investigar mais a fundo. Encontrei este ótimo post do HackWordPress que fornece um pequeno trecho de código para adicionar Gravatars aos seus comentários. Desde então, tenho adicionado suporte a Gravatar a todos os temas aqui, apenas porque é muito simples de fazer. Neste guia, mostrarei como eu integro exatamente os Gravatars aos temas.
Antes de continuar, por favor, entenda que este guia foi escrito apenas para WordPress 2.5 e superior. O código abordado não funcionará em versões anteriores.
O Código Gravatar
Apenas inserir o seguinte código no seu loop de comentários funcionará, mas provavelmente não ficará muito bom como está.
<?php if(function_exists('get_avatar')) { echo get_avatar($comment, '50'); } ?>
Basicamente, este código verificará se você tem a função get_avatar (nativa do WordPress 2.5) e, em seguida, exibirá o avatar do comentarista em um quadrado de 50px.
Use uma Régua
Se você quiser ter certeza de que seus Gravatars estão em um tamanho adequado, recomendo a extensão do Firefox MeasureIt. Isso o ajudará a medir uma área no 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 exatamente eu coloquei este código?
Qualquer lugar dentro do foreach e endforeach (o loop de comentários) funcionará.
Estilizando seus Gravatars
Assim que você tiver os Gravatars exibidos no seu template de comentários, provavelmente você vai querer estilizar eles também. Você notará que o código do Gravatar gera a classe “avatar” em cada imagem. Vamos adicionar uma linha à folha de estilos CSS para flutuar isso para a esquerda e adicionar uma pequena margem à direita.
img.avatar {float:left; margin-right:5px;}
Pronto, você tem Gravatars com boa aparência, tamanho perfeito e estilizados. Claro que os temas variam, você pode estilizar como quiser.
Conclusão
Lembre-se, este código só funcionará no WordPress 2.5 e superior. A condicional function_exists tag fará com que seu tema não quebre, mas nada aparecerá em versões anteriores. Mais informações sobre outros métodos de uso de Gravatars estão detalhadas no WordPress Codex.
Se você acabou de ler este artigo inteiro e não tem ideia do que é um Gravatar, sugiro que leia este primeiro por Lorelle no WordPress. Ele aborda o básico de como obter seu próprio Gravatar se inscrevendo no Gravatar.com, bem como o uso de Gravatars em versões mais antigas do WordPress com plugins.
Gravatars não podem ser usados apenas para comentários, mas também podem ser adicionados aos posts individuais dos autores também.
Se você gostou do artigo, sinta-se à vontade para comentar e compartilhar. Gostaria de ouvir suas opiniões. Assine o feed para as últimas atualizações do Theme Lab.
Muiiiiiiiiiiiiiiiiiiiito obrigado!!!! 🙂
Uau! Isso ajuda. Fiquei horas mexendo no meu tema não premium tentando descobrir isso. O suporte do Codex do WordPress não ajuda muito. Eles não explicam exatamente onde colocar o código. Que alívio ter encontrado este site. Trabalho com programação desde 2008 e ainda me deparo com problemas.
Obrigado, estou tendo alguns problemas reais para fazer isso funcionar no meu blog, mas espero que isso ajude. Estou usando um tema que roda no Thematic, então consigo encontrar o "foreach" que você mencionou, mas não o "endforeach", e quando adicionei o código não funcionou para mim. Acho que vou continuar tentando!
Obrigado por este ótimo tutorial, amigo! Funciona perfeitamente! Ebaaa!
Funcionou como mágica! Muito, muito obrigado, Leland, pelo seu post! Seu blog é verdadeiramente uma bênção para todos que usam WordPress! 🙂
Muito obrigado – funcionou como mágica!
Seu tema deve conter um avatar, pois é bastante padrão no WordPress. Se não tiver, é um tema ruim, e seria melhor você encontrar outro tema. 😉
Meu tema não contém este loop dentro do comments.php, alguma ideia?
Meu Deus, finalmente um código que funcionou… Não conseguia fazer o sistema carregar os avatares que estavam anexados aos e-mails dos autores… o seu funcionou!!
Muito, muito obrigado.
Obrigado, acabei de configurar no meu blog também.
Muito obrigado! Foi fácil 🙂
legal, terminei com os comentários
mas quero adicionar mais informações a cada post sobre o autor
seu nome
seu avatar
e biografia
meu blog aqui http://www.eskandarany.org/blog
como e qual o código CSS para estilizar todas essas novidades
obrigado desde já 🙂
Olá,
Informação útil, agora integrei com sucesso o Gravatar ao meu site.
Abraços,
Eddie Gear
[...] Saiba mais: Usando Gravatars Adicionar suporte a Gravatar aos seus comentários do WordPress [...]
[...] Adicionar suporte a Gravatar aos seus comentários do WordPress [...]
[...] adicione Gravatars ao seu blog WordPress, baixe o plugin e siga estas instruções. Simples! var addthis_pub = ‘RichmondWiki’; var addthis_brand = ‘Your Search Advisor’;var […]
@Alejandro: Confira este link: http://themeshaper.com/how-to-add-gravatars-for-the-post-author-in-wordpress/
Oi cara, o post é incrível. Mas meu problema é associar a imagem do gravatar a uma imagem de autor no meu blog WordPress index.php. Eu não sei a sintaxe correta para fazer isso. Você tem alguma sugestão? Muito obrigado!!!
Realmente eficaz, eu estava procurando por isso. Obrigado.
[…] por mim mesmo. Este tema tem todos os recursos normais de um tema de blog aqui no Theme Lab, incluindo suporte ao Gravatar para comentários, uma barra lateral pronta para widgets e suporte nativo a tags do WordPress. Este tema também [tem um espaço para] anúncio de 125×125 […]
Muito obrigado por este post. Depois de ler isto, levei cerca de 4 minutos para seguir suas instruções e fazê-las funcionar no meu site.
Você arrasa!
[…] Theme Lab – Adicionar suporte a Gravatar aos seus comentários do WordPress — para adicionar mais imagens à seção de comentários […]
ótimo!! ainda bem que encontrei isso. agora para encontrar uma maneira de redefinir meus comentários para que todos tenham gravatares ao lado deles.
Fico muito feliz por ter encontrado seu site. Ótimas informações sobre como adicionar um Gravatar ao site de alguém. Perdi horas tentando mexer com um plugin e levei apenas segundos seguindo seus exemplos para obter o que eu queria para o site.
Muito obrigado! Eu só queria ter pesquisado você mais cedo 🙂
O código funciona para colocar os avatares nos comentários. Estou tendo problemas com o alinhamento no IE7.
No IE7, o primeiro avatar se alinha corretamente, então os avatares em comentários subsequentes são recuados para a direita em alguns pixels.