Colocar Botões Curtir Facebook, Google + e Retweet dentro das postagens no Blogger

Quem desenvolve um blog de qualidade já sabe da importância das redes sociais, elas fazem você interagir diretamente com seu visitante e atingem diretamente seu público alvo, dessa forma cria-se fidelidade com o visitante, fazendo ele voltar várias vezes, nesse post vamos ver como adicionar os botões das principais redes sociais em suas postagens, assim seus usuários poderam indicar suas postagens pra amigos ligados as redes.


Adicionando Botões Curtir, Google +, e Twitter!

1. Vá até, "Design"," Editar HTML", "Expandir modelos de widgets" e procure por: <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'> e imeditamente antes cole o código abaixo:

<div align='right'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=80&amp;action=like&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:80px; height:20px'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<g:plusone size='medium'/>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a class='twitter-share-button' data-count='horizontal' data-via='USERNAME_DO_SEU_TWITTER' href='http://twitter.com/share'>Tweet</a><script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
</b:if>
</div>
2.  Adicione seu Username onde indicado no código acima, salve e veja o resultado em seu Blog.

Veja Também:
Enviar postagens automaticamente para o Twitter
Colocar gadget Twitter no blog

Não esqueça de comentar se deu tudo certo, aqui em baixo.

17 comentários:

  1. Funcionou direitinho. Muito obrigada!

    Lembrando aos colegas que o código citado acima deve ser colado depois que o <*div class='post-body entry-content' expr:id='"post-body-" + data:post.id'> está fechado.

    Eu por exemplo colei o código dos botões no final do post, depois da linha que diz o nome do autor, então colei depois do

    <*div class='post-footer'>
    <*div class='post-footer-line post-footer-line-1'><*span class='post-author vcard'>
    .....blablablabla....
    <*/div>

    Somente então coloquei o código dos botões.

    (sem os asteríscos *)

    ResponderExcluir
  2. Boa noite, instalei o botão curtir no meu blog porem ele não posta o resumo da postagem, apenas vai o titulo e a imagem. Como que funiona esse resumo? São as Metatags? O que poderia ser feito para corrigir? Poderia me ajudar nesse sentido?

    ResponderExcluir
  3. Será que existi um jeito de trocar a cor do texto do botão curtir?

    ResponderExcluir
  4. Nao apareceu aqui nada, entao removi..

    ResponderExcluir
  5. Cambada de BURROS! Tão fácil colocar este código, antes de falar mal desta bela postagem vai fazer um curso de HTML básico! Ficou show no meu blog...

    ResponderExcluir
  6. seus inteligentes que estão criticando esse codigo tem um codigo que as visualizações só dá para ver dentro das paginas internas ou seja somente dentro das postagens não adianta colocar e apertar visualizar tem que salvar e depois clicar em uma postagens e visualizar faça isso e não critique o tutorial

    ResponderExcluir
  7. Gostaria de Saber como retirar,por favor R E S P O N D A.. abs

    ResponderExcluir
  8. otimo tuto! alguém sabe como colocar esses botões no resumo do post(na tela inicial do blogger)?

    ResponderExcluir
    Respostas
    1. Resolvido,adicionei uma barra de botões ao resumo do post :)
      Tentei postar o codigo que eu usei, mais não é permitido usar html aqui nos comentários =/

      Abraço.

      Excluir
  9. está com problema no g+ só ele não aparesse o twitter e face tá legal..

    ResponderExcluir
  10. Funcionou muito obrigado. Meu blog ainda ta em construcão e vocês do solucões blogs me ajudaram bastante!

    ResponderExcluir
  11. Obrigado amigo, finalmente eu consegui encontrar um que realmente funcione!!!!

    ResponderExcluir

Todos os direitos reservados © Soluções Blog - Desenvolvido por Gustavo Solbas. Tecnologia do Blogger.