Como colocar o botão do Twitter no Blog – Blogger ou WordPress.org

Siga o Ferramentas Blog: Canal no Youtube | Facebook | Twitter | Google+

Uma pergunta que recebo sempre é sobre como colocar o botão do Twitter nos artigos do blog. Seja no WordPress ou no Blogger, o importante é facilitar a divulgação do seu conteúdo nas redes sociais. Um botão de Retweet (RT) oferece ao visitante um caminho fácil de indicar seu conteúdo de forma automática. Vou mostrar aqui uma forma simples de colocar esse botão junto ao texto do seu blog.

Já ensinei diversas soluções para integrar o Twitter ao seu blog e recomendo que veja esses links como complemento:

Mas nesse pequeno tutorial, meu objetivo é simplificar esse processo, sem muitos detalhes para quem quer um resultado imediato, sem se preocupar com como cada coisa funciona.

Esse é o modelo padrão e oficial do Twitter. Primeiro para quem usa o Blogger e depois para quem usa o WordPress.org.

1. Se usa o Blogger (BlogSpot):

Abra o painel do Blogger, clique no menu “Design” ~> “Editar HTML” e marque a opção “Expandir modelos de widgets”:

design-editar-html-widgets-blogger

Agora procure por uma linha de código semelhante a essa:

<div class='post-body entry-content'>

E imediatamente ACIMA disso, cole o trecho  que vai adicionar o botão do Twitter no seu blog junto ao primeiro parágrafo do texto:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='display: inline; float: right; margin-left: 5px'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="SEUTWITTER">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</p>
</b:if>

Onde está vermelho coloque o seu nome do Twitter, sem a “@”. Salve o modelo e veja o resultado já funcionando em seu blog.

2. Se usa o WordPress.org:

Acesse o painel do seu blog no WordPress.org e clique no menu “Aparência” ~> “Editor” e abra o arquivo do tema “Post único (single.php)”. Você terá de procurar a linha mais adequada para inserir o trecho de código do botão.

Encontrando a linha, cole o seguinte:

<div style="float: right; margin-left: 10px;">
<a href="http://twitter.com/share" class="twitter-share-button" data-url="<?php the_permalink(); ?>" data-count="vertical" data-via="SEUTWITTER">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</div>

O que está marcado de vermelho deve ser trocado pelo seu nome no Twitter. Salve e veja o resultado já funcionando no seu blog.

Agora não tem mais desculpas para não colocar um botão do Twitter para retweets no seu blog. Cada post terá uma forma de ser divulgado diretamente no Twitter.

Outros gadgets para o seu blog:

8 Comentários

  1. Olá, ao fazer o recomendado, deparo com esta mensagem de erro ao salvar o modelo html:

    Não foi possível salvar o modelo

    Corrija o erro abaixo e envie o seu modelo novamente.
    Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: The value of attribute "data-url" associated with an element type "null" must not contain the '<' character.

    Será que fiz algo errado?

    Responder

  2. Amigo,
    Pode ser que você tenha copiado algo errado ou colado o código faltando algum pedaço.
    E observe que há dois códigos aí. Um é para o Blogger e outro para WordPress e são diferentes.

    Responder

  3. Parabéns Marcos Lemos!

    Um maneira simples e rápida de por um coisa tão importante no blog que é um botão de Retweet!

    Realmente cada vez mais os blogs estão sofrendo os impactos das redes sociais principalmente o Twitter o Facebook. Não um impacto negativo, mais se um impacto positivo que pode contribuir em grande quantidades para alavancar o numero de visitantes, assinantes e seguidores do nosso blog.

    Valeu!

    Responder

  4. Usei o código em meu blog e funcionou corretamente!
    Está aí mais uma dica para aumentar a divulgação dos conteúdos do blog, Valeu Marcos!

    Responder

  5. Olá Marcos, bom post.

    Mas fiquei interessado em saber qual o plugin que vc usa (se é que usa) para enviar o post por e-mail. Esse do ícone de envelope logo abaixo do final do post.

    Abraço e parabéns pelo blog.

    Responder

  6. Estou com um problema.
    Eu quero que o botão apareça na home também sendo assim tirei a condicional. O problema é que ao invez tweetar o link da postagem, tweeta o link do blog, da home.
    como corrige isso?

    Responder

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.