Botão para compartilhar links no FaceBook para Blogger

Para quem usa o Facebook já viu que é possível criar um espaço para seu blog e divulgar seus links lá, bem como em seu perfil de compartilhar isso com dezenas e até centenas de outros usuários. Isso se torna um potencial local de divulgação do seu blog, e as redes-sociais são muito poderosas em difundir informações, gerando mais visitas para seu blog. Veja como adicionar um botão contados de links compartilhados no Facebook para os artigos de seu blog.

Eu, Marcos Lemos, também estou no FaceBook: Clique aqui para meu perfil.

Já ensinamos aqui como adicionar um botão de Re-tuitar (enviar para o Twitter), para que seus visitantes compartilhem seus links no Twitter e divulguem seu blog:

• TweetMeme – RT para seus artigos no Twitter

Você pode ver esse botão logo abaixo de todos os títulos de artigos do [ Ferramentas Blog ], bem como um pequeno botão azul do FaceBook. Existem vários modelos de tamanhos diferentes, inclusive com os números contando a quantidade de vezes que alguém enviou seu link para lá.

Sempre que alguém clicar a contagem vai subir e seu link será enviado para a página do Mural de links daquela pessoa, divulgando seus artigos.

Como adicionar o botão de compartilhar do Facebook.

Vou mostrar como adicionar o código do botão em seu blog, mas o local para isso você vai ter que escolher por si. Claro que o ideal é logo abaixo do título para ficar visível, mas ao final do artigo também é uma boa escolha, pois quando alguém acabar de ler já clica para compartilhar. Saiba mais sobre onde posicionar, lendo aqui:

• Configurando as partes dos Artigos do Blog

Adicione o seguinte código em qualquer parte de seu blog, preferencialmente para aparecer abaixo do título do artigo, junto ao corpo do texto:

<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>

Esse é o modelo de caixa com contador de cliques. Os números só aparecem depois que alguém clicar uma primeira vez. Quando é adicionado e ninguém clica, fica apenas o botão mais fino da base.

Não tem como trocar a palavra “Share” (compartilhar) em inglês. Isso é padrão.

Exemplo de uso e onde incorporar ao seu layout.

Você pode adicionar imediatamente abaixo do título de seu artigo, alinha ao primeiro parágrafo do lado direito do texto, como se ficasse incorporado ao artigo, chamando bem a atenção de quem lê. Ficaria como coloquei a imagem alinhada à este parágrafo. É uma boa estratégia e muita gente usa dessa forma. Para isso vamos adicionar uma condicional ao código e colocar ele dentro do código-fonte de seu layout.

1. Abra o painel do Blogger, clique no menu “Layout” ~> “Editar HTML” e marque o “Expandir modelos de widgets” para visualizar todo o código-fonte. Então procure pela seguinte linha:

<div class='post-header-line-1'/>

2. Imediatamente ABAIXO disso cole o trecho, sem modificar nada:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style="float:right;padding:4px;">
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='box_count'/>
<script type="text/javascript" src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"/>
</div>
</b:if>

3. Salve o modelo e veja o resultado.

Para que você posso alinhar o botão do lado esquerdo do primeiro parágrafo, basta você mudar a palavra “right”, em vermelho no código, para “left”.

Se você quiser outras opções de formatos do botão e saber mais detalhes sobre esse serviço do FaceBook e como customizar ainda mais, veja a ajuda oficial:

• FaceBook Share – Implementing Facebook Share