Botões de compartilhamento do Facebook, Twitter e Google Plus no blog [Tutorial]

Como muitos devem ter percebido qe varios sites tem botões de compartilhamento ,  especialmente o botão "Compartilhar" do Facebook e Twitter, pois tem contadores como o do Google Plus.
Depois de alguns pedidos resolvi fazer um tutorial para ensinar como colocar eles no blog.



Vamos aprender como instalar?
Para você instalar estes botões do Facebook, Twitter e Google Plus no seu blog, e poder compartilhar facilmente suas postagens e imagens, é simples.

Para começar, faça backup de segurança do seu template.

Se ainda não tiver, crie um App no Facebook e o instale no blog. (COMO CRIAR E INSTALAR UM APP DO FACEBOOK)

Tendo seguido o passo acima, vá em MODELO >> EDITAR HTML e procure a linha:

]]></b:skin>

Cole ACIMA dela o seguinte código:

#fbvmp {
float: left;
margin-top: -1px;
margin-right: 40px;
margin-left: 10px;
}

Em seguida procure a linha:

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

Se houver mais de uma dessa linha, é a segunda ocorrência. Cole abaixo dela o código seguinte:

<a class='twitter-share-button' data-lang='pt' data-via='NOMEUSUÁRIO' expr:data-text='data:post.title' expr:data-url='data:post.url' href='https://twitter.com/share'>Tweetar</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
<g:plusone annotation='bubble' expr:href='data:post.url' size='medium'/>
<div id='fbvmp'><div class='fb-share-button' data-action='recommend' data-colorscheme='light' data-height='The pixel height of the plugin' data-send='false' data-show-faces='true' data-type='button_count' data-width='The pixel width of the plugin' expr:href='data:post.url'/></div>

Note que onde está escrito NOMEUSUÁRIO, você deve substituir por seu nome de usuário do Twitter sem o @. Cuide para não apagar nenhuma aspa, substitua somente NOMEUSUÁRIO.

Salve!

Agora vá em Configurações>>Preferência de pesquisa no seu painel Blogger. No alto dessa página, em Metatags, clique em editar e depois selecione Sim. Escreva uma descrição para seu blog e salve. Agora sempre que você criar ou reeditar uma postagem lá no editor de postagens do Blogger, aparecerá na coluna a esquerda a opção "Preferência de pesquisa". Alí escreva a descrição da sua postagem. Esta deverá aparecer quando alguém recomendar/compartilhar sua postagem no Facebook. Se não houver descrição do post, aparecerá a do blog. Simples, não é?
Comentários
2 Comentários

2 comentários:

Anônimo disse...

vlw

Bruno disse...

Muito Obrigado :D

Postar um comentário

xitertop.blogspot.com.br
xitertop.blogspot.com.br