Botões de Compartilhamento em Forma Link de Texto ou Imagens

Usar botões de compartilhamento nas postagens do blog ajuda que seu conteudo seja compartilhado em redes sociais pelos seus visitantes e por isso é bom conhecer varias opções de personalizar esses botões das redes sociais no seu blog como por exemplo deixar os botões flutuantes ou fixos no canto da pagina, colocar botões de compartilhamento em imagens. Então hoje ou até mesmo criar links de texto ou imagens que ao passar o mouse sobre eles aparecem os botões do Addthis para compartilhar seu conteúdo no Facebook, Twitter, Google+ e outras redes sociais.

Botões de Compartilhamento em Forma Link de Texto ou Imagens

Não usa os botões do Addthis no seu blog precisará colocar o código completo dele na sua pagina como um gadget de HTML/javascript. Para fazer isso entre na pagina layout > adicionar gadget > HTML/javascript e cole o código:

<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=xa-5162b7b529880e09"></script>

Lembrete: Se você já tem os botões do Addthis no seu blog então você não precisa colocar esse código!

Veja outras dicas para compartilhar e divulgar seu blog:
Botões das Redes Sociais na Vertical - Compartilhar Posts
Como Divulgar um Site ou Blog de Forma Correta e Eficiente
Colocar Botões de Compartilhamento nas Imagens

Colocar botões de compartilhamento em imagens ou textos

Em links de texto o código fica desta forma:
<a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=300&amp;pubid=xa-5162b7b529880e09">Compartilhe</a>

A palavra compartilhe no link você pode alterar para qualquer texto que desejar e usar esses links dentro de postagens ou na sidebar do seu blog. Veja aqui uma demonstração deste código: Passe o mouse aqui para compartilhar.

O trecho do link xa-5162b7b529880e09 é a identificação do Addthis, então se no seu blog já tem os botões e você fez o cadastro para acompanhar as estatísticas dos botões de compartilhamento você deve trocar essa parte pelo seu id igual está no seu código dos botões do Addthis.

Para colocar essa ferramenta de compartilhamento em imagens você deve apenas acrescentar ao código HTML da imagem o trecho class="addthis_button". Quando colocar uma imagem na postagem do blogger clique na guia HTML e coloque o código que mostramos no HTML da imagem, então o código depois de alterado deve ficar parecido com esse:

<a class="addthis_button" href="http://2.bp.blogspot.com/-izUYhhJZzw0/UWLHAt_cLBI/AAAAAAAAHzE/Yf484VQ4gT8/s1600/compartilhar-dicas-blogs.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="275" src="http://2.bp.blogspot.com/-izUYhhJZzw0/UWLHAt_cLBI/AAAAAAAAHzE/Yf484VQ4gT8/s400/compartilhar-dicas-blogs.jpg" width="400" /></a>

Leia também:
Formatação Especial nos Textos das Postagens
Colocar Botões de Compartilhamento em Forma de Coração no Blog
Dicas sobre Colocar Efeitos em Fotos/Imagens e Como Fazer Banners

Esse código da imagem é da imagem deste tutorial, para testar o código e ver como  funciona passe o mouse na imagem que está no inicio deste tutorial. Esperamos que gostem dessa dica e encontrem maneiras criativas de usar isso e conseguir mais divulgação para seu site ou blog.

5 comentários :

  1. ISSO É SERIO ME AJUDA!!!


    Oi,sei que aqui não é o Post certo para comentar,mais preciso de muita ajuda!Outro dia vi aqui um Post de como criar botoes (não lembro exatamente o nome,enfim ) ai em baixo tava escrito :
    "Como este" ai apareceu um botãozinho do Blogger tipo assim:
    + Add this blogger (ou algo do tipo) ai eu cliquei em cima e apareceu se eu queria colocar no meu blog eu disse que sim!Só que agora esta lá o logo do seu blog (FIXO,não sai mais!) olha só a imagem : http://2.bp.blogspot.com/-22szZ7_dfxI/UWSRFvp3P0I/AAAAAAAAAnM/5dbg170ZdKo/s1600/photoscapeevc.blogspot.com+Mo%C3%A7o+tira+isso+porfavorrr.JPG

    Eu adoro seu blog,mais se isso não sair terei que tomar medidas drasticas! Serei obrigada a denuncia-lo!Porfavor quero respostas logo!
    Mande uma mensagem no meu &mail rafabueno13@hotmail.com

    ResponderExcluir
  2. rafaela entre na pagina layout do seu blog e clique para editar o primeiro gadget da sua sidebar.

    esse banner é um gadget comum que você pode editar, remover ou trocar de lugar

    ResponderExcluir
  3. Qual o codigo para girar 90 graus uma foto horizontal e posibilitando colocar na lateral esquerda do blog sem alterar a o tamanho da foto.

    ResponderExcluir
  4. Anonimo para girar a imagem você precisa de um programa ou site para editar imagens e depois salvar a imagem no formato que precisa. Veja os links abaixo:

    Criar Banners ou Imagens para Usar em Blogs

    Botões de Compartilhamento Fixos no Canto da Pagina

    Neste link dos botões de compartilhamento tem o código para fixar nas laterais de pagina que funciona com qualquer coisa, então pode usa-lo nas imagens que criar

    ResponderExcluir
  5. É muito interessante usar links como o propósito de deixar o site mais leve pois os botões oficias são meio pesadinhos.

    ResponderExcluir