BlogAjuda © 2007.
Simple Grey theme developed by Rodrigo P. Ghedin.
Fenômeno entre os blogs, principalmente aqueles movidos pelo WordPress, o gravatar (globally recognized avatar) é uma representação gráfica de uma pessoa. Na maioria dos blogs, surge quando alguém, que possui um, comenta. A instalação do plugin do gravatar para WordPress é trivial, mas por algum motivo sobrenatural e inexplicável, muita gente não consegue instalá-lo corretamente. Neste artigo, tentarei destrinchar tudo a respeito deste plugin.
O sucesso desta aplicação se deve, acredito eu, à forma inteligente e controladora com que foi implementado. Primeiro que o serviço é rigoroso: ao enviar uma imagem, ela só é liberada após passar por uma verificação feita por pessoas. Estas classificam cada imagem. Esta classificação diz se a imagem é apropriada ou não para todas as idades, e pode ser de quatro tipos, a saber:
(Créditos da lista acima ao Bruno Alves, que escreveu um ótimo artigo sobre o assunto. Vale a leitura.).
Sendo assim, cabe ao webmaster decidir quais status poderão aparecer no site. O lance de associar a imagem ao e-mail é outra característica que justifica o sucesso do serviço. Nada de cadastros, formulários, logins e senhas; basta inserir seu e-mail, comentar, e o gravatar surgirá automaticamente.
Explicado o que é o gravatar, e como ele funciona, vamos ao que interessa. Antes de prosseguir, baixe o plugin Gravatar. Envie o arquivo gravatar.php para a pasta /wp-content/plugins/, entre no painel administrativo do seu blog, e ative-o na área Plugins.
Tal qual a maioria dos plugins para WordPress, este também depende de um código para ser exibido. Como a intenção é exibi-lo na área de comentários, abra o arquivo comments.php do seu tema; vamos trabalhar nele, e somente nele.
Você deve localizar o “loop” do comentário, no já citado arquivo comments.php. Esta área começa no seguinte código: <?php if ($comments) : ?>. Abaixo disso, e antes do código <?php endforeach; ?>, você deve inserir o código que estudaremos abaixo.
A sintaxe do código é a seguinte:
<?php gravatar("censura", tamanho, "gravatar-padrão", "cor-da-borda"); ?>
Parece complicado, mas não é. Abaixo, escreverei três exemplos, cumulando, um após outro, os atributos possíveis (em tempo, todos opcionais):
<?php gravatar("R"); ?>
Assim, somente serão exibidos gravatares que possuírem classificação “R” (vide lista acima).
<?php gravatar("R", 40); ?>
Além de só permitir imagens com classificação “R”, estas serão redimensionadas para o tamanho 40×40 pixels. Lembrando que o padrão é 80×80 pixels.
<?php gravatar("R", 40, "http://www.seusite.com/default.jpg"); ?>
Os dois atributos acima, com o adicional de que, caso o comentarista não possua um gravatar, uma imagem pré-definida (no caso, a default.jpg) será exibida.
<?php gravatar("R", 40, "http://www.seusite.com/default.jpg", "#000000"); ?>
Todas as características acima, com o acréscimo de uma borda, no exemplo (#000000), preta. Confesso que, por mais que tenha tentando, não consegui implementar este atributo no meu blog, tanto que tive que apelar para o CSS para conseguí-la.
Como disse acima, todos os atributos são opcionais, logo, se você quiser exibir os gravatares de todas as classificações, com tamanho 80×80, sem imagem-padrão, e sem borda, basta escrever o código <?php gravatar(); ?>.
Para terminar, independente de qual solução você preferir, é imprescindível colocar o código numa tag (X)HTML de imagem. Afinal, o código acima puxa o endereço do gravatar apenas. Exemplificando:
<img src="<?php gravatar(); ?>" alt="Gravatar" />
Entendido? Qualquer coisa, perguntem nos comentários, ou no nosso fórum. Espero que o artigo seja de grande ajuda!
Obrigado pela referência.
O Gravatar é uma ferramenta muito interessante e já está se tornando um padrão, lá fora.
Abraços
Posted by Bruno Alves
July 10th, 2006, às 10:07 am. #.
Sabe que eu tava pra te perguntar que plugin você usava pra exibir gravatar, Ghedin?
Opa, ótimo manual sempre quis instalar mas nunca sabia como exatamente (não sabia que tinha que editar o comments.php). Quem me deu a dica foi o Newton Mota. Porém ele não estava conseguindo instalar e eu descobri porquê
na última linha, onde você colocou alt="Gravatar" /> falta uma aspa antes do “alt”
" alt="Gravatar" /> seria o correto
^^
espero ter ajudado
[]’s
Posted by Douglas d'Aquino
July 10th, 2006, às 3:50 pm. #.
[…] -> BlogAjuda -> Bruno Alves […]
Posted by :: pura subversão, igual leite de soja :: » Mostre a sua cara
July 14th, 2006, às 10:40 am. #.
Fala, Bruno!
Em primeiro lugar gostaria de agradecer pelas dicas, instalei o Gravatar no meu blog e tá muito legal.
Aproveito para sugerir um tópico para os próximos posts: que tal você abordar “Sistemas de Banners para WP”?
Hoje cedo um leitor deixou um comentário perguntando qual sistema de banner era utilizado lá no meu blog, como não uso nenhum me bateu uma curiosidade de saber mais a respeito (tô até dando uma pesquisada) e acho que outras pessoas poderiam se interessar também.
É isso, tá dada a sugestão.
Abs!
Ops, me referi a você como Bruno. Foi mal, Rodrigo! hehehehe
Opa,
Qual plugin vc usa no seu blog pra mostrar nos comentários o navegador e o sistema operacional que a pessoa usa?
Daniel, o nome do plugin é Browser Sniff.
[]’s
Posted by Rodrigo P. Ghedin
August 11th, 2006, às 8:41 pm. #.
Não querendo ser abusado, mas já sendo, vc não poderia passar um tutorial?
Posted by Daniel
August 11th, 2006, às 9:25 pm. #.
[…] Este artigo foi criado após um pedido de um visitante do BlogAjuda, o Daniel. Sugerir temas para novos textos é ótimo, tanto para os visitantes, que terão o que querem, quanto para mim, que terei um assunto pronto para trabalhar. Portanto, sintam-se à vontade para sugerirem assuntos a serem abordados em futuros textos. […]
Posted by Browser Sniff at BlogAjuda
August 14th, 2006, às 2:29 pm. #.
[…] notícia a volta dos Gravatares, que permite uma interação a mais aos blogs, aliás, você pode instalar o Gravatar no seu blog agora (wordpress). « Wikipédia… de […]
Posted by Gravatar de volta - leanDrow.net
February 13th, 2007, às 1:57 pm. #.
[…] a cabea para descobrir. O Blog Ajuda tem um tutorial que explica direitinho como instalar. Clique aquipara ler, caso tenha […]
Posted by Todo dia um novo dia. » Blog Archive » Ausncia Justificada
February 18th, 2007, às 6:41 pm. #.
Por incrivel que pareça, não consigo fazer esse troço funcionar!
[…] BlogAjuda […]
Posted by Como colocar a sua imagem nos comentários… - Blog Mestre
April 10th, 2007, às 11:20 pm. #.
Rodrigo, o link para o plugin gravatar mudou para:
http://site.gravatar.com/plugins/wp_gravatar.zip
Grande abraço!!!
Posted by Sampson Moreira
May 6th, 2007, às 10:22 am. #.
Caro Rodrigo, tenho uma cópia do meu site na minha máquina, instalei o gravatar para testar e não funcionou, aparecem os avatares nos comentários, um em cada comentário, porém não aparece o que eu coloquei como default, aparece uma imagem do próprio site gravatar, me cadastrei no gravatar e upei uma imagem para ser meu avatar lá, postei localmente no meu site e o meu avatar registrado lah tbm n apareceu, será que estou fazendo algo errado?
Posted by AJ Oliveira
June 29th, 2007, às 9:57 pm. #.
Instalei o plugin e ta funcionando normal, mas onde a pessoa escolherá o avatar? Pois nao achei isto.
[]’s Alexandre
@ AJ Oliveira
Acho que localmente o gravatar não funciona. Já tentei aqui, e não deu certo…
@ Alexandre
No próprio site do gravatar.
[]’s!
Posted by Rodrigo P. Ghedin
July 21st, 2007, às 11:08 am. #.
Ok, Rodrigo, subi pro meu site e ele funciona bem, só a imagem “default” que não consigo fazer aparecer a que eu quero…ele mostra igual aqui no seu site..uma imagem do próprio gravatar…não dá pra colocar um default de nossa escolha?
Posted by AJ Oliveira
July 21st, 2007, às 5:51 pm. #.
No Judão.com.br, tem um monte de gente que não tá conseguindo colocar gravatar…já fez o upload mas não aparece.
Posted by Blaze
July 22nd, 2007, às 9:45 pm. #.
@ AJ Oliveira
<?php gravatar("R", 40, "http://www.seusite.com/default.jpg"); ?>
O código acima não funcionou? Uso ele no meu blog pessoal, e funciona direitinho (dá uma olhada nos comentários de algum post lá).
@ Blaze
Pois é… Registrei o e-mail que uso aqui no BlogAjuda há alguns dias, e até agora nada também. O site do gravatar vira e mexe dá problema. Acho que daqui a algum tempo as coisas se estabilizam.
[]’s!
Posted by Rodrigo P. Ghedin
July 23rd, 2007, às 6:29 pm. #.
[…] artigo foi criado após um pedido de um visitante do BlogAjuda, o Daniel. Sugerir temas para novos textos é ótimo, tanto para os […]
Posted by WWW2.Devanagari.com.br » Blog Archive » WP- Browser-sniff
July 25th, 2007, às 8:53 pm. #.
[…] já é bastante conhecido, e muitos blogs o usam para exibir os avatares dos comentaristas. Instalá-lo é relativamente simples, e salvo quando o site do serviço resolve dar algum piripaque (o que, diga-se de passagem, anda […]
Posted by BlogAjuda » Gravatar do autor do post
August 4th, 2007, às 11:29 am. #.
Testando o meu Gravatar
Posted by Fabio Raphael
August 8th, 2007, às 3:12 am. #.
não consigo de forma alguma redimensionar o tamanho padrão das imagens mesmo usando o código disponibilizado pelo Rodrigo
Baixei um gif animado pra ser usado como meu avatar, já vi isto em alguns blogs, só que o meu não funciona!
O tamanho esta adequado (80 x 80). Qual é o problema ?
Posted by Tânia
September 6th, 2007, às 11:48 am. #.
Tenho o mesmo problema da Tânia. Baixei um gif animado pra ser usado como meu avatar. Só que ele só fica parado, o q pode ser??? Se puder responder por e-mail, fico agradecido.
Ei,
eu também queria muito colocar um avatar em movimento, e não consigo, será que você me ajuda a resolver isso?
Como fazer com que ele continue em movimento após o cadastramento no site gravatar?
Posted by Marise
September 13th, 2007, às 8:36 am. #.
Parabéns pelas dicas, e recursos que disponibiliza para novatos no WP, no meu caso. rsrs
Olá, boa noite….
Dúvidas em relação ao código:
1) Eu apenas coloquei esse código
logo abaixo de
Está correto?
2) Quanto a este código:
<img src=”" alt=”Gravatar” />
Devo salva-lo como html e enviar para qual pasta?
Esse código <img src=”" alt=”Gravatar” />
Devo salva-lo num bloco de notas e salvarcomo html? Depois para onde enviar?
Alguém pode me ajudar?
Obrigada
Posted by Nuvem que passa
September 27th, 2007, às 10:31 pm. #.
S-o-c-o-r-r-o ! ! ! !
Posted by Nuvem que passa
September 27th, 2007, às 10:35 pm. #.
Estou testando uma versão do meu site em wordpress, fiz tudo certinho, me cadastrei no gravatar, enviei uma foto, e quando faço um comentário em algum post, a foto não aparece, aparece o avatar padrão (esse G do gravatar). Eu posto o meu e-mail que eu cadastrei no gravatar, mas mesmo assim não dá certo. O que pode estar acontecendo?
Posted by Inexistent Man
October 7th, 2007, às 1:38 pm. #.
Inexistente men,
como você fez para fazer o gravatar funcionar, ou seja, que fique posicionado ao lado de cada comentarista e que apareça o avatar da pessoa que tenha gravatar?
Posted by Nuvem que passa
October 7th, 2007, às 4:49 pm. #.
teste
Posted by Nuvem que passa
October 7th, 2007, às 4:55 pm. #.
Esse site que vc deve ter visto ainda é do blogger, mas no outro que estou desenvolvendo (wordpress) é só colocar a imagem do gravatar do lado do comentário, e colocar um estilo tipo “float: left”.
Posted by Inexistent Man
October 7th, 2007, às 6:16 pm. #.
Inexistent Man,
Não entendi o que voce quis dizer com:
“…e colocar um estilo tipo “float: left”.” Como assim?
Desculpe a ignorância.
Vi que no blogger vc conseguiu fazer funcionar direitinho.
Eu não consigo de jeito nenhum… coloquei esse código:
<img src=”" alt=”Gravatar” />
veja como ficou o código:
if ($comments) : ?>
to “”
<img src=”" alt=”Gravatar” />
<li class=”" id=”comment-”>
comment_approved == ‘0′) : ?>
Your comment is awaiting moderation.
Você sabe o que tem de errado?
Posted by Nuvem que passa
October 8th, 2007, às 7:42 pm. #.
ps.: o código acima ficou incompleto :( :(
Posted by Nuvem que passa
October 8th, 2007, às 7:43 pm. #.
No meu blog estou fazendo assim:
<img src=”" alt=”Gravatar” style=”float: left; margin-right: 6px” />
Isso faz mostrar o gravatar de nível “R” (imagens consideradas para todo o tipo de público) e o 40 é o tamanho da imagem (40×40 pixels - você também pode usar o número 80 para imagens 80×80 pixels) e o style da imagem eu defini como “float: left”, que significa que ela vai ficar do lado esquerdo do comentário, e o “margin-right: 6px” dá uma margem de 6 pixels do lado direito da imagem, pro texto não ficar muito grudado.
Posted by Inexistent Man
October 8th, 2007, às 11:48 pm. #.
Bom, vc deve estar usando o código PHP do gravatar, mas aí está o restante do código. Procure no comments.php o início do comentário, aqui começa com , coloquei o código do gravatar antes disso.
Posted by Inexistent Man
October 8th, 2007, às 11:52 pm. #.
comment_author_link()
Posted by Inexistent Man
October 8th, 2007, às 11:52 pm. #.
Inexistent man,
coloquei o codigo que voce indicou:
logo acima de:
E não apareceu o avatar. Ficou assim:
�Gravatar� nome da pessoa
Pq com vc deu certo e comigo não? O que fiz de errado, afinal?
[]s
Nuvem…
Posted by Nuvem que passa...
October 9th, 2007, às 12:54 am. #.
Me manda um e-mail que eu posso te ajudar.
inexistent.man arroba gmail.com
Posted by Inexistent Man
October 9th, 2007, às 11:54 am. #.
Estou mandando agora. Obrigada.
Posted by Nuvem que passa...
October 9th, 2007, às 1:27 pm. #.
Conseguir configurar tranquilo. :P
Posted by Tiago Celestino
November 4th, 2007, às 11:38 am. #.
Putz! Instalei um tema que prometia o Gravatar :( Aparentemente o código está certo, mas não aparece nada Me arrasei rs…
<a href=”http://www.gravatar.com/” title=”"> <img src=”" class=”gravatar” alt=”" />
Estou o usando o tema 3k2, do Hakan Aydin http://aydin.net/blog/2006/03/23/three-column-k2-theme-for-wordpress-3k2/. O Gravatar é nativo, mas mesmo assim não funciona.
estou testando o gravatar no meu blog… mas nao consigo fazer com que a imagem fique no lado direito, igual ao que tem aqui!
:(
Posted by Wagner
December 18th, 2007, às 4:00 pm. #.
Não consigo encontrar os desenhos para colocar no meu comentário que fiz com relação o comportamento da cantara britney.
Posted by Cláudio Silva
December 19th, 2007, às 6:16 am. #.
Bom tutorial, parabéns.
Posted by Will
December 20th, 2007, às 9:56 pm. #.
day key mail site go trust all man pets glass
Posted by boatletterwa
June 22nd, 2008, às 2:00 pm. #.
joke england white green right stay glass speed wood
Posted by microsoftlan
July 3rd, 2008, às 5:47 am. #.
trust america mail tree boy english site canada are joke minor all minor me
Posted by uglykitchena
July 28th, 2008, às 4:28 pm. #.
woman juicy keyboard yahoo key ugly house ugly
Posted by stayyouday
August 27th, 2008, às 4:13 pm. #.
steven man stone go english day green all greed you you
Posted by siteallcanad
August 30th, 2008, às 10:51 am. #.
BlogAjuda © 2007.
Simple Grey theme developed by Rodrigo P. Ghedin.