Como colocar o botão do Pinterest nas imagens do post

Hoje vou ensinar vocês como colocar o botão do Pinterest, o "Pin It",  nas imagens do post. Pra quem não conhece e não sabe pra que serve, ao clicar no Pin It você automaticamente salva a imagem para a sua conta no Pinterest. Acho que vale super a pena ter no seu blog, pois é uma forma muito legal de divulgação de posts :D  Passe o mouse em cima da imagem para ver como fica:

Lembrando que é muito importante ter imagens boas, bonitas e que chamam atenção do leitor. Assim você desperta o interesse da pessoa que viu a sua imagem no Pinterest, fazendo com que ela visite o seu blog.

Vamos lá: 

Primeiro você tem que escolher a imagem do botão. Se for criar, prefira fazer com o fundo transparente. Eu criei alguns pra vocês, é só salvar e colocar em um site de hospedagens de imagem ou copiar a URL (link) da imagem aqui mesmo (clique em um dos "links das imagens"):

    

LINKS DAS IMAGENS: Coração | Circulo | Estrelas

Dica: Eu criei todos no PicMonkey


Como vamos mexer no código HTML do Blogger, recomendo que você faça um backup do seu layout antes de tudo.

Vá em MODELO > EDITAR HTML, procure e coloque o código antes de </body>

Código:

<script>
//<![CDATA[
var bs_pinButtonURL = "COLOQUE AQUI O LINK DA SUA IMAGEM";
var bs_pinButtonPos = "center";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'/>
<!-- please do not alter or remove the following code -->
<div id='bs_pinOnHover'><a href="http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html">Pin It button on image hover</a></div>

Salve e Prontinho!