sexta-feira, 26 de novembro de 2010

Como colocar share buttons do Blogger

social-media-iconsEste é um post que estou devendo há tempos, já que o recurso foi lançado em junho. Trata-se de como ativar os botões de compartilhamento ou share buttons oficiais do Blogger.
Esses botões servem para enviar os posts por email e/ou para o Twitter, Facebook e Google Buzz, com apenas 1 clique.
Como ativar os share buttons nos templates do Designer do Modelo
Entre em design>elementos de página. Em postagens do blog, clique em editar
share-buttons
Irá abrir uma janela pop-up. Marque a caixa Mostrar botões de compartilhamento
image
Clique em salvar e pronto! Os botões de compartilhamento serão ativados.
image
Os botões aparecem com fundo cinza e, ao passar o mouse, ficam coloridos.
Como ativar os share buttons em templates personalizados
Entre em design>editar HTML. Marque a caixa expandir modelos de widgets.
Cole este código de acordo com o local onde você quer exibir os botões:
<div class='post-share-buttons'>
        <b:if cond='data:post.sharePostUrl'>
          <b:include data='post' name='shareButtons'/>
        </b:if>
      </div>
Embaixo do título do post
Colar antes de <div class='post-body'> ou de <div class='post-body entry-content'>
No final do post
Colar antes da linha <div class='post-footer'>
No rodapé dos posts
Colar antes de <p class='post-footer-line post-footer-line-3'> ou de <div class='post-footer-line post-footer-line-3'>
Clique no botão visualizar e se tudo estiver ok, salve o template.

Sobre o autor: Juliana é a fundadora deste blog. Nascida em 1970, é médica e, nas horas vagas, blogueira. Também é top colaboradora do fórum de ajuda do Blogger. Twitter l Google Plus l Facebook l

28 comentários:

  1. Oi Jú! Muito boa a postagem. Parabéns!
    Eu sempre gostei desses buttons!
    Ah! Meu Site já está no ar! Se puder dá uma olhada!
    http://www.verweb.com.br
    Migrei do Blogger para o Wordpress com uma dica aqui de seu Blog! Muito obrigado!
    Até + e fica com Deus!

    ResponderExcluir
  2. Eu acabei de fazer as instruções acima e os meus botões ficaram cinza. Vcs sabem o que pode estar errado ? www.quemlefazseufilme.com.br

    ResponderExcluir
  3. Juliana, acabei de fazer as alterações e meus botões ficaram cinza. Quando eu passo o mouse por eles, fica colorido. É assim mesmo ? Pra quem não sabe do truque do mouse parece que está desabilitado :-(
    Vc sabe o que pode estar errado ? www.quemlefazseufilme.com.br

    ResponderExcluir
  4. yeah..ate que en fin.achei.!! Brigaduuu.

    ResponderExcluir
  5. Obrigado! Ju o meu template é personalizado e não sabia como colocar os share buttons, ja tenho o AddThis o melhor é quanto mais divulgação melhor né?
    Dê uma olhada em meu blog quando estiver desocupada http://www.ideiasdokevin.com

    ResponderExcluir
  6. Baixei um template e não aparece todo rodapé do post, incluindo os botões de compartilhamento. Tentei encontrar a linha indicada mas não existe post-footer-line post-footer-line-3' nesse template.
    Alguém pode me ajudar?
    bjks
    Mel

    ResponderExcluir
  7. Vocês são feras mesmo, vlw por compartilhar.

    ResponderExcluir
  8. Ju,
    Esse eu já tinha visto no blog do Marcos (rs). Porém eu não estava entendendo. Obrigado pelo tutorial.

    ResponderExcluir
  9. ...o mesmo problema da Mel é também o meu (e não é de hoje isso...), a linha que a Juliana indica não existe em nenhum dos meus três blogs e, não é o caso de (expandir modelos widgets), isso tudo já foi feito e nada!
    Em outro post "Código para Posts Relacionados" muita gente ficou a ver navios e, também daquela vez ninguém soube explicar, nem mesmo a Ju (o silêncio foi sepulcral).
    Com certeza é aquelas coisas que não tem explicação, e alguns modelos não contam com essa linha de código...sabe lá Deus por quê!?

    Mesmo assim parabéns para quem pode usar e ficar feliz!

    Abraços,

    Uno

    ResponderExcluir
  10. Ah Ju, desculpa, desconsidere meu comentário anterior, eu impulsivo, peguei a primeira linha de código e não me dei conta do "ou", ...meleca!
    Em todo caso, a solução também servira para a "impulsiva da Mel" que, obviamente e como eu, não deve ter percebido isso!

    Abraço,

    Vc é perfeita sempre, chega dar nojo, brincadeira, hehehe...

    Bj e desculpa a minha ignorância,

    Uno

    ResponderExcluir
  11. Sem comentários. Fantástico! Obrigado mais uma vez, Juliana!

    ResponderExcluir
  12. Valeu, mais uma vez, Juliana!
    Meu template é personalizado e não estava conseguindo.
    Faltam muitas coisinhas!
    Obrigada

    ResponderExcluir
  13. Infelizmente não funcionou no meu blog. E ele não tem template personalizado. Tanto que tentei adicionar o código HTML, mas nem encontrei os elementos.

    Demora algum tempo para os buttons aparecerem?

    ResponderExcluir
  14. não to conseguindo fazer a s alterações, encontrei nos códigos html, mais não to encontrando esses códigos ai pra eu inserir antes o código que vc nos passou pra copiar e colar...por favor me ajude!!

    obrigado e Deus abençoe!

    ResponderExcluir
  15. gostei, coloquei os botões em um lugar diferente.
    Eu estava procurando também era uns modelos iguais de botões para ir para o twittwr e para o facebook do meu blog.

    ResponderExcluir
  16. Eu acho bem legis estes ícones, mas eu sou fã mesmo, é do AddThis

    ResponderExcluir
  17. Uma vez estava mexendo em um blog de teste e não conseguia fazer aparecer os share buttons de jeito nenhum. Pensei que fosse algum bug e desisti.

    Só hoje, lendo este post despretenciosamente é que me dei conta do meu erro: o template que estava usando era personalizado e precisava acrescentar algumas linhas de código a mais.

    Por mais simples que o post a primeira vista pudesse parecer, aprendi algo nele hoje. Valeu Juliana!!!

    ResponderExcluir
  18. No meu template personalizado nao tem nada de div.clas, nao consegui colocar os gadgets. O q faço?

    ResponderExcluir
  19. Obrigada pela dica, Juliana!!! Os botoes de share it nao estavam funcionando antes, mesmo estando configurados no bloguer a aparecer!!! Serà que o meu problema com "segidores" é pq meu template é personalizado e "nao aceita" o modelo de seguidores do bloguer???

    ResponderExcluir
  20. Boa tarde!
    Seu blog sempre me ajudando, parabéns sou fã de carteirinha do seu blog.

    Muita Paz, Saúde e Sucesso.

    ResponderExcluir
  21. tem como add mais redes sociais como o MySpace, Sonico?

    ResponderExcluir
  22. Oi Juliana! Adoro o seu blog. Tenho um blog educacional e as vezes faço uma reforma geral no coitado. Aproveitei estas férias para isso, e com sua ajuda coloquei o botão para o twitter, o tradutor e os botões de compartilhamento! Nem tenho palavras para expressar o meu profundo agradecimento! Beijos e abraços.

    ResponderExcluir
  23. Obrigado vc é uma santa da Internet!!! rs

    ResponderExcluir
  24. SIMPLES E OBJETIVO SUPERBACANA MESMO OBRIGADO

    ResponderExcluir
  25. Obrigado, consegui colocar!!! Resolveu meu problema!!

    ResponderExcluir