Botão enviar postagem para o Twitter



O Twitter se tornou uma grande fonte de divulgação de um blog/site. O comum agora é surgir novos gadgets para interar ainda mais esse serviço aos blogs.

O botão enviar para o twitter é um desses serviços. Ele fica disponível a todos os visitantes, assim se a pessoa gostar da matéria e quiser divulgar pelo twitter, o botão organiza tudo!

Antes de começar, recomendo que faça backup de seu template. Por segurança.
Vamos ao que interessa!
- Faça login no Blogger. Entre em “Layout” -> “Editar HTML”. Depois marque a caixa: “Expandir modelos de widgets”.

- Agora você deve escolher a opção de local onde vai ficar o widget e o tipo (completo ou compacto).


  • Primeira Opção: Botão ao lado direito do título do post
Procure (Ctrl + f) por:
<div class='post-header-line-1'/>
ou
<div class='post-header-line-1'>
ou
<div id='post-header-line-1'/>
ou
<div id='post-header-line-1/>
Escolha a forma do botão abaixo e insira o código ACIMA do lugar encontrado:

• Para botão completo
<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'Usuario_ Twitter';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
OU

• Para botão compacto
<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'Usuario_ Twitter';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
Agora edite a parte VERMELHA, colocando no lugar de Usuário_Twitter o nome de login do seu Twitter.
Exemplo: pauloestevao

Agora teste, se tudo estiver certo, salve.
  • Segunda Opção: Botão abaixo da postagem
Procure por:
<div class='post-footer'>
ou
<div id='post-footer'>
Cole o seguinte código DEPOIS:

• Para botão completo
<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'Usuario_ Twitter';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
OU

• Para botão compacto
<div style="float:right;padding:4px;">
<script type="text/javascript">
tweetmeme_style = 'compact';
tweetmeme_url = '<data:post.url/>';
tweetmeme_source = 'Usuario_ Twitter';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
</div>
Agora edite a parte VERMELHA, colocando no lugar de Usuário_Twitter o nome de login do seu Twitter.
Exemplo: pauloestevao

Teste e salve.
Artigos Relacionados:

25 Comentários:

  1. Weverton Guedes

    Paulo,
    Obrigado! Já implantei e gostei muito. Já vi em alguns blogs e achei bem prático.

    Boa dica!


    Abraços

  2. Ton

    valew ! perfeito !

  3. Cristiano

    Acabei de colocar no blog e deu tudo certo. Obrigado pela dica.

  4. Sou blogueiro - INDICOESSE

    Isso ai é bem prático, e apostarei provavelmente nessa nova ideia!
    Muito bom seu blog!
    Tou louco pra ganhar o domínio!

  5. Carlos Tomaz

    Boa dica Paulo!

  6. Pamela Kovac

    Excelente widget.
    Sem dúvida alguma, é uma ótima dica para blogueiros e twitteiros.
    Abraços! :)

  7. utilnet

    Oi,
    aproveitei e como forma de agradecimento pela dica "Retwittei" este seu post, ;).

    Abraço,
    Miguel (Utilnet)

  8. utilnet

    Oi,

    Obrigado pela dica / pelo widget.

    Já coloquei no Utilnet.
    Funciona "impecavelmente".

    Abraço,
    Miguel (Utilnet)

  9. Ígor

    Qual seria o código para que o botão fique ao lado esquerdo do post? Obrigado.

  10. Paulo Estevão

    @igor,
    no lugar de float:right; coloque float:left;

  11. lukafree

    Paulo, havia colocado o widget um tempo atrás em um blog e funcionou legal. Agora fui colocar no outro blog e não teve jeito. Tenho certeza que segui todas as etapas corretamente.
    Os dois blogs estão configurados no TwitterFeed.
    Tentei de tudo e nada.
    O que poderá ter acontecido?
    Você poderia ajudar?
    Abraços,
    Luka

  12. Ígor

    Valeu Paulo! Muito bom!

  13. Paulo Estevão

    @lukafree,
    por email por favor! =]

  14. Blog do Tavares

    Boa Paulo, eu tava procurando esse widget ;)

    Abraços!

  15. tutty gualberto

    Segui suas instruções e instalei o TWEETMEME com facilidade no meus blogs.
    Obrigado pela ajuda.
    Abraços

  16. Luka Almeida

    Paulo, enviei o e-mail.
    Obrigada pela atenção!
    Abraços,
    Luka

  17. PC@maral

    Já coloquei no PC@maral Funcionou direitinho! Valeu!

  18. nilton

    Paulo eu gostaria de saber como coloco uma pequena imagem nesse mesmo local dessa do twitter, queria que ficasse só a imagem mesmo depois de cada post, não precisa ter link, como eu coloco?
    niltonpacola@bol.com.br

  19. Paulo Estevão

    @nilton:

    < img border="0" alt="" src="LINK IMAGEM"/ >

  20. webgringos

    Obrigado a dica ajudou muito...!

  21. Silvio Junior Wencevoski

    Paulo, excelente dica!

    Utilizei apenas o código que você passou em meu template modificado fiz diferente!

    Utilizei o tutorial do Lenon para adicionar o botão do Dihiit, coloquei o código abaixo do botão e funcionou!

    Da uma passadinha lá no blog (Grana Sempre) e olhe!

    Abraços e OBG!

  22. Corretora Brasil (Imobiliária) - Corretora Brasil (Imobiliária)

    Obrigado coloquei no Blog...
    http://corretorabrasil.blogspot.com/

  23. Corretora Brasil (Imobiliária) - Corretora Brasil (Imobiliária)

    Desculpa o ultimo comentário coloquei a url...
    Coloquei no Blog e ficou legal estava procurando esse código..

    Wellington Torrejais

  24. Iúri

    Essa dica foi a que resolveu meu problema!

    Achei muitas, mas nenhuma havia funcionado. Obrigado mesmo.

    Parabéns!

  25. Franci Samveira

    Fo muito útil para mim, estava procurando esta widgets há bastante tempo...

Postar um comentário

Adicione seu comentário nesse post.
- Não aceito comentários anônimos;
- Não aceito parceria! Caso tenha uma boa proposta, entre em contato;
- Antes de pedir ajuda sobre o tutorial, tente fazer sozinho e tenha certeza que seguiu todas as etapas corretamente.
- Comentários irrelevantes não serão aceitos.

Muito obrigado por sua visita. Volte sempre!