Como adicionar um botão de Compartilhamento do Facebook às postagens do Blogger

Permitir que outros compartilhem facilmente seu conteúdo em mídias sociais é algo que sempre é importante. Felizmente, muitos dos serviços que usamos para nossa promoção on-line têm botões de compartilhamento social que podemos implementar em nossos sites. Adicionar um botão do Facebook Share ao Blogger é um pouco diferente de alguns outros sites porque queremos que o botão insira automaticamente o URL da página em que o visitante está atualmente ou o post que eles querem compartilhar, sem precisar atualizar esse link manualmente.

Adicionar um botão Compartilhar ao modelo do seu blog garante que ele permaneça no lugar na parte inferior de cada postagem e com o código abaixo, o link será automaticamente inserido no botão.

Vamos começar

Faça login em sua conta do Blogger e faça Backup do seu modelo no caso de algo dar errado.

Vá para Tema> Editar HTML.

Clique dentro da área de texto do editor e pressione CTRL + F (ou CMD + F se você estiver em um Mac) para abrir a caixa de pesquisa "localizar" no canto superior direito.

Na caixa de pesquisa, cole esse código e pressione enter:

<div class='post-footer-line post-footer-line-1'> 

Você irá encontrar 2 códigos desse iguais, mas o primeiro é só exibição móvel. Pressione Enter novamente para pular para a segundo código. Este é o seu blog normal. Ok!

Diretamente acima dessa linha de código, cole esse código:

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

Se você quiser que ele apareça no topo de sua postagem, salte de volta para o topo do editor e procure a SEGUNDO código desse abaixo que no caso também há 2 deles (opte sempre pelo segundo, ok):

<data:post.body/>

Após encontrar o código insira o anterior acima de <data:post.body/>

Escolhendo o tipo de botão

O Facebook tem 6 tipos de botões que você pode escolher. Você pode vê-los aqui no menu suspenso "Layout". Na parte " BUTTON-TYPE " do código acima, digite um dos seguintes nomes como mostra abaixo:

• Caixa_contagem
• Button_count
• botão
• Ícone_link
• ícone
• ligação

Salve seu modelo

O script não aparecerá no modo de visualização, então salve seu modelo e verifique seu blog ao vivo para o seu novo botão Compartilhar!