14/08/2010

Twitter button no seu blog - botão retweet

O Twitter lançou o seu próprio botão para enviar as postagens do blog para o Twitter (retweet), é muito fácil de usar principalmente porque não precisa alterar nada no código do botão que achamos nos Twitter Goodies >> Tweet Button. Você só precisa entrar no Twitter, escolher entre as opções de modelos de botão e pegar o código do seu retweet button e para colocar no seu blog também é muito fácil e rápido.

Entre na pagina do Tweet Button, escolha uma das opções de botão, sugerimos não alterar nada nas configurações: Tweet text, URL e Language, a única que seria interessante é o idioma, mas quando escrevemos esse tutorial ainda não tem a opção português (item language).

twitter button
Depois que escolheu seu modelo é só copiar o código no final da pagina e voltar ao blogger, entre na pagina designer >> editar html, clique para expandir o modelo e coloque o código logo junto com <data:post.body/>.

codigo do botao retweet

Escolha se prefere o botão retweet no inicio ou final do texto de sua postagem e coloque o código antes ou depois do trecho que citamos. Evidentemente colocar o código antes faz o botão aparece no inicio do texto e colocar depois o botão aparece no final do seu texto.

Podemos também escolher o lado que o botão aparecerá, colocando o código fornecido pelo Twitter dentro da tag div, deste jeito:

<div style="float:left; margin:2px">codigo do botao retweet</div>

Do jeito que está o código acima o botão aparecerá do lado esquerdo, se preferir do lado direito troque a palavra left por right.


Notamos uma diferença entre o numero de retweets mostrado pelo contador entre esse botão oficial do Twitter e os botões feitos pelos sites Meme e Topsy, mas esperamos que essa falha seja corrigida em breve. Embora seja um pouco difícil (trabalhoso) saber qual deles é o mais correto.
Related Posts with Thumbnails

84 comentários:

  1. Depois de qual trecho eu colo o código? Não foi citado o trecho...

    ResponderExcluir
  2. colocar o codigo aonde?????

    "Depois que escolheu seu modelo é só copiar o código no final da pagina e voltar ao blogger, entre na pagina designer >> editar html, clique para expandir o modelo e coloque o código logo junto com ." Não está faltando texto aqui?

    ResponderExcluir
  3. Você poderia me ajudar numa coisa
    eu keria saber se há alguma maneira de dxar fazer akela pagina de quando você entra nela diz que esta em manutenção.Obrigado
    Seu blog é 10!

    ResponderExcluir
  4. é para colocar o codigo junto de qeu extamente?

    ResponderExcluir
  5. é para colocar o código perto do trecho <data:post.body/>

    ResponderExcluir
  6. acho que ocorreu algum erro e o código não apareceu em alguns navegadores, mas republicamos a postagem e agora parece estar tudo certo

    ResponderExcluir
  7. Anônimo
    não tem como deixar só um aviso de pagina em manutenção, o que pode é fazer uma postagem falando sobre isso ou adicionar um gadget no inicio do blog com o aviso.

    ResponderExcluir
  8. Não to achando de jeito nenhum esse

    alguem pode me ajudar?

    ResponderExcluir
  9. use o ctrl F, precisa clicar para expandir o modelo para achar.

    pesquise por post.body, as vezes um espaço em branco atrapalha o ctrl f

    ResponderExcluir
  10. Oi, Fabiano, como eu coloco este botão à direita?
    Obrigada.

    http://www.coisasdepedralva.blogspot.com

    ResponderExcluir
  11. Mônica Bustamante, achei sua pergunta interessante e fiz uma atualização na postagem, agora ela mostra como colocar o botão do lado esquerdo ou direito

    ResponderExcluir
  12. Olá, Fabiano. Tudo bem? Adorei a dica. Gostaria de saber como faço para centralizar o button? Obrigada desde já. =)

    ResponderExcluir
  13. a postagem é realmente muito interessante,mas eu tenho medo e mudar e não saber voltar atrás!

    ResponderExcluir
  14. Em qual div> devo colocar isso? Não consegui.

    ResponderExcluir
  15. Mônica
    no mesmo lugar que colocou o código do botão retweet

    ResponderExcluir
  16. Deu tudo certo, exceto que quando clico em retweet ele retweet link do meu blog e não para cada post dele. Você sabe como fazer para arrumar isso?

    Obrigada

    ResponderExcluir
  17. quando clico envia para o twitter o link da página inicial, não o link do post.

    precisa clicar no link do post primeiro ou é algum problema mesmo?
    como resolvo isso?

    ResponderExcluir
  18. para funcionar em cada postagem precisa colocar o código para aparece o botão somente nas paginas individuais, veja aqui como fazer: Conteúdo diferente nas paginas do blog

    ResponderExcluir
  19. Fabiano, sabe como posso inserir o botão na tela inicial dos post? Sem que os visitantes precisem entrar no post para acionar o botão!
    O botão ficou dentro do post, daí o pessoal usa o botão do share que linka o post pelo via @AdThis. Queria que fosse pelo @santanasales (meu twitter) e o botão do twitter já está todo configurado!
    Valeu

    ResponderExcluir
  20. pode tentar adicionar o botão como um gadget de html/javascript, assim ele funcionar para a pagina que está sendo visitada

    ResponderExcluir
  21. Tentei, mas não ficou legal!
    Quero deixar os dois botões: Curtir e Twitter na tela inicial do post, sem que o visitante tenha que entra no título do post!
    Exemplo: www.brainstorm9.com.br
    Valeu

    ResponderExcluir
  22. Saulo Sales
    veja o lugar que colocou esses códigos, deve ter algo assim perto antes deles <b:if cond='data:blog.pageType == &quot;item&quot;'>
    codigos ....
    </b:if>

    é só colocar os códigos fora desta tag, veja mais detalhado aqui: Conteúdo diferente nas paginas do blog

    ResponderExcluir
  23. Obrigado pela dica. Depois de procurar muito por diversos posts em diversos blogs na net, encontrei aqui a dica completa para colocar o botão do lado direito do post. Valeu mesmo!

    ResponderExcluir
  24. Deu tudo certo Fabiano.Obriga.Gostaria de saber como colocar de outra cor. Gostava mais do verde.

    ResponderExcluir
  25. esse botão oficial do Twitter só tem nesta cor, mas se quiser pode usar outro fornecido pelo topsy: Botão Retweet Personalizado - Topsy

    ResponderExcluir
  26. O botão apareceu lá em baixo do blog e não no pos :/

    ResponderExcluir
  27. o lugar que o botão aparece depende de onde colocou o código

    ResponderExcluir
  28. adicionei o botão aqui e funcionou perfeitamente
    o único problema é o contador, que permanece em 0 mesmo depois de eu ter "tweetado" o post

    meu código ficou assim
    Tweet

    procurei na net, mas até agora não encontrei nada pra resolver o problema

    abraço

    ResponderExcluir
  29. Douglas C. R. Paes
    nos testes que fiz o botão oficial do twitter sempre mostrou menos retweets que outros botões

    ResponderExcluir
  30. Mas o meu problema é maior, pois o que acontece não é que mostra "menos", ele não mostra nada.
    O valor é sempre 0.

    ResponderExcluir
  31. o código do botão retweet feito pelo proprio twitter não tem como fazer alterações nele, então sugiro usar um botão de outro site como:meme(Colocar botão retweet no blog) ou topsy(Botão Retweet Personalizado - Topsy)

    ResponderExcluir
  32. Legal... vou testar

    obrigado pela dica

    depois posto aqui o resultado

    abraço

    ResponderExcluir
  33. Usei a dica do meme(Colocar botão retweet no blog), e agora está funcionando perfeitamente...

    se quiserem conferir, o endereço do blog é http://hotwheelsaddiction.blogspot.com

    obrigado

    ResponderExcluir
  34. Não tem a entrada no HTML do meu blog.

    P.S: eu uso o blogspot

    ResponderExcluir
  35. o blogspot tem a pagina designer e nela tem uma guia para editar o html

    ResponderExcluir
  36. Obrigada pelas informações, foram muito úteis! Já estou usando no meu blog.

    Valeu!

    ResponderExcluir
  37. Deu certo!!
    Obrigado mais uma vez. Seu blog é ótimo.
    Parabéns!

    ResponderExcluir
  38. Meu blog amigoZen já tem 1 ano na net e sempre que decido acrescentar ou mudar algo na sua página, sempre pesquiso por aqui. Valeu pelas dicas, obrigado pelas postagens. Como forma de agradecimento, postei o seu banner,ok? Abração

    ResponderExcluir
  39. Ola... nao consigo colocar nenhum botao no meu blog.. nem do twitter, nem do facebook, nem de nada :( meu blog e do wordpress.. eh porque eu tenho que comprar o ccs ou eh possivel colocar-los sem comprar o ccs? espero que obtenha uma resposta, ja fiz de tudo mas nao consigo.... obrigada

    ResponderExcluir
  40. os sites tem intruções para usar os botões no wordpress... que é diferente que usar no blogger

    ResponderExcluir
  41. fabiano, boa tarde

    Coloquei o botão certinho no meu blog, mas ao inves dele encurtar o link da postagens, ele encurta a pagina inicial do meu blog, porque?

    ResponderExcluir
  42. se colocar como um gadget ele vai usar a pagina atual não importa qual seja ela.

    para enviar as postagens precisa colocar pela pagina editar html

    ResponderExcluir
  43. Fabiano eu coloquei logo apos no html, ai beleza o botão aparece, depois clico para postar no twitter ele aparece lá que ira encurtar a pagina inicial do meu blog e alem disto quando entro no twitter o endereço do meu blog sai normal sem o endereço encurtado, pior que eu baixei outro template e da este mesmo problema

    ResponderExcluir
  44. isso é algo interno dos códigos do Twitter, não temos como alterar nada...

    infelizmente o jeito é usar o botão feito por outro site caso não goste de como o twiitter faz o dele.

    Botão Retweet Personalizado - Topsy


    TweetMeme - Colocar botão retweet no blog

    ResponderExcluir
  45. FABIANO COMO COLOCAR O TWITTER COM TODAS AS POSTAGENS DAS PESSOAS Q ME SEGUEM E Q EU SIGO NO BLOG? NAO SÓ AS MINHAS. JA VI EM UM BLOG MAIS NEM LEMBRO QL FOI. SE SOUBER ME ENSINA. OBG!

    ResponderExcluir
  46. Mel, não me lembro de ter visto algo assim, mas veja aqui: Ferramentas e Acessórios para o Twitter, lá tem praticamente de tudo para o twitter

    ResponderExcluir
  47. Olá Fabiano, tem como eu deixar no centro?

    ResponderExcluir
  48. no código onde falamos para colocar float:left; margin:2px use text-align:center e o botão ficará centralizado

    ResponderExcluir
  49. Fabiano gostaria de saber pq o meu botao nao esta contando direito tipo o twitter vai mais o cantador nao sai do 2 o mesmo e pro face bok eu tenho o codigo daquele addthis www.hamuleque.co.cc

    ResponderExcluir
  50. o botão as vezes demora um pouco para contar os envios... mas não adianta você mesmo enviar varias vezes, ele só conta uma

    ResponderExcluir
  51. Infelizmente eu instalei mas quando eu fui testar, percebi que enviava o endereço do blog, mas não a notícia em questão, como em outros blogs que usam.

    ResponderExcluir
  52. ei cara eu coloquei talz ai começa com 14 tweets sendo que eu nao twittei nada --' e quando twito fica 14

    ResponderExcluir
  53. Fabianooo, eu coloquei o botão mais ja apareceu com 86 tweet! como mudar isso?

    ResponderExcluir
  54. Yudji e Lumagga
    quando li o primeiro comentário pensei que fosse erro no colocar o código, mas como são duas pessoas falando sobre o assunto deve ser erro do site que gera o botão, acho que devem corrigir isso em breve..

    ResponderExcluir
  55. Peter
    clique para expandir o modelo de widgets e use o ctrl f para procurar

    ResponderExcluir
  56. Olá!
    Eu coloquei o codigo e aparentemente estava tudo certo... mas notei algo estranho
    Quando eu clico para retweet aparece o titulo do blog+ url encurtada + via
    sendo que deveria aparecer titulo do post+ url encurtada + via
    Vc sabe como arrumar??
    OBS: peguei o código do site do twitter mesmo!
    Obrigado pela atenção
    No aguardo.

    ResponderExcluir
  57. Blog Paocommorttadela
    depende de como era o código.. . veja aqui um deste tipo que falou: Links das redes sociais em forma de menu

    ResponderExcluir
  58. Salve galera.
    É o seguinte
    Coloquei o código no fim da postagem e deu tudo certo, mas o problema é que quando alguém usa o botão a contagem soma em todos os posts. Exceto quando eu entro em um post específico. Ai sim a contagem é individual. Mas do contrário em todos os meus posts o numeros de retweets é o mesmo.
    O que eu estou fazendo de errado?

    Valew.
    Excelente blog...

    ResponderExcluir
  59. Buccini
    na verdade esse código mostra os twitts da pagina atual... ou seja na pagina inicial do seu blog provavelmente será maior, mas não é uma soma

    ResponderExcluir
  60. Ajude-me, eu consegui colocar o botão no meu blog, mas não consigo mudar o lado onde ele vai aparecer, porque não achei a linha de código que vc citou no post :/

    ResponderExcluir
  61. Paloma

    no código onde está div style="float:left; margin:2px

    se trocar left por right o botão ficará do lado direito

    ResponderExcluir
  62. Sim encontrei o . e apos isto coloco que codigo???alguem pode ajudar?

    ResponderExcluir
  63. depois do post.body que você coloca o código

    ResponderExcluir
  64. boa tarde fabiano...
    eu coloquei no meu blog ao lado.. em html/javascrip...
    mais o button começou a contagem do numero 12 e sobe a contagem sem ngm twittar... que bug eh este?
    obg desde ja.

    www.backdiz.blogspot.com

    ResponderExcluir
  65. Mateus Back
    dizer qual é a contagem certa é complicado... mesmo se usar botões retweet de outros sites(topsy ou meme) verá diferenças na contagem

    ResponderExcluir
  66. OI!Estou precisando de uma ajuda!E logo pensei no seu blog. Não tem a ver com o twitter. Tenho um blog fã clube, e queria promover o fã do mês,os usuários tem que enviar a foto e uma frase. Tem como os visitantes enviar uma foto ou frase? Por favor me ajude.

    ResponderExcluir
  67. Preciso De ajuda. o Botão fico antes do resumo da postagem nao tem como fica so no final?

    ResponderExcluir
  68. Tuis
    precisa trocar o lugar do código do botão no seu html.

    ache o código do resumo e coloque o código do botão depois dele

    ResponderExcluir
  69. Tuis
    tem varias formas de fazer o resumo da postagem, mas procure por class='jump-link' acho que todos os códigos tem isso.

    veja aqui: Fazer Resumo da Postagem com Miniaturas das Imagens

    ResponderExcluir
  70. Cosegui! muito obrigado mais 1 vez. Sempre nois ajuda

    ResponderExcluir
  71. Fabiano poderia me ajuda ?

    quero coloca o botao do Retweet em baixo de cada postagem, eu consigo mas tenho problemas.

    EX: Eu uso esse codigo aqui e da Certo ele Retweet Com o Titulo e Link do Post mas soh que quando eu Acabado de Twittar o numero nao sobe Fica soh em "0" .


    [ CODIGO ]
    ____________________________________________

    Twittarz


    ___________________________________________


    e quando eu uso esse codigo gerado no twitter

    [ CODIGO ] GERADO NO TWITTER
    ____________________________________________


    Tweet
    !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.
    src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"scrAQUIipt","twitter-wjs");


    ___________________________________________

    Quando eu uso esse codigo ele Retwitta o Link Do Site e nao do Post.

    OBS: eu coloco eles abaixo do tag




    Se vc poder me ajudar eu agradeco muito.



    ( EH SOH APAGAR AONDE ESTA ESCRITO "AQUI" USEI ISSO PARA PODER POSTAR A PERGUNTA )

    ResponderExcluir
  72. Fabiano o Botao de Retweet no meu blog nao esta Contando nao, ele soh conta os Tweets quando eu post, mas quero que ele conta sem entrar no post tem como ? pf me ajuda ae

    ResponderExcluir
  73. Johnnt dependendo de como usou o código o botão retweet a pagina atual ou seja só vai contar no post quando estiver na pagina dele.

    ResponderExcluir
  74. tipo eu soh peguei o codigo e coloquei em baixo da linha ...

    div class='post-footer-line post-footer-line-3'/

    ResponderExcluir
  75. como faco para contar na pagina inicial ?

    qual codigo eu uso ?

    ResponderExcluir
  76. como faco para coloca pra contar na pagina inicial ?

    ResponderExcluir
  77. aparece três linhas com esse comando. Qual seria o certo? .

    ResponderExcluir
  78. Filosofia Ateista isso varia conforme o template...

    faça testes para descobrir qual é o certo, mas não precisa usar o código do botão para testar.

    uma coisa simples que gosto de fazer para testar se estou no lugar certo do código é digitar varias letras iguais seguidas, por exemplo: zzzzzzz


    e visualize seu blog se as letras aparecerem no lugar esperado use o código do botão. Acho isso mais simples de fazer e verificar assim não depende de nenhum outro código externo na hora de fazer o teste.

    ResponderExcluir