Olá galera do 'Blogando de verdade' neste tópico ensinarei a como por botões das redes sociais para compartilhar o mesmo. Isso é excelente, pois possibilita que os leitores divulguem nossos artigos em outros locais, tais como: Twitter, RSS, Orkut, Google Buzz, Facebook (mania do momento) e etc.
Existem muitos modelos de botões de redes sociais. Porém o que vou ensinar é um dos mais completos.
Vamos lá, mãos a obra: 1º faça login do Blogger, clique em layout, figura abaixo
Depois HTML/javascript e cole o código abaixo:
<div style="position:fixed; bottom:20%; margin-left:-98px; float:left;width:60px;background-color:#ffffdf;padding: 5px;border:1px solid #000;border-right:none"><center><div class="addthis_32x32_style">
<a class="addthis_button_preferred_1"></a>
<a class="addthis_button_preferred_2"></a>
<a class="addthis_button_preferred_3"></a>
<a class="addthis_button_preferred_4"></a>
<a class="addthis_button_compact"></a>
<a class="addthis_counter addthis_bubble_style"></a>
</div></center></div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e2088636f7cce31"></script>
</div>
Não importa o lugar onde o gadget ficará posicionado, você poderá deixar em qual configuração optar.
Como editar a posição dos botões da redes sociais no seu blog.
Position:fixed; bottom:20%; margin-left:-98px: posição dos botões... então altere a altura na página 20% e o posicionamento horizontal modificando o valor -98px, aqui o valor é negativo ou seja o sinal de subtração (menos) faz parte do posicionamento.
float:left: lado que aparece a caixa.
width:60px: largura da caixa.
padding: 5px: margem entre as bordas da caixa e os botões.
background-collor:#fffdf: cor do fundo da caixa de botões de compartilhamento. Leia mais sobre cores
border:1px solid #000:border-right:none: neste trecho tiramos um lado da borda para parecer que a caixa de botões pareça com nosso layout.
Ficará assim:
Espero ter ajudado, e lembrando se tiver dúvidas, sugestão ou comentários, post em baixo.
Obrigado!
Olá, tudo bem?
ResponderExcluirNão poderia deixar de fazer este comentário. Estava há dias procurando um código de botão suspenso que ficasse legal no meu blog e achei aqui.Fiz algumas alterações para arredondar as bordas e ficou show. Parabéns pela postagem.
Show, Obrigado http://www.dicadeblog.com.br/
ResponderExcluir