Colocando um botão de compartilhamento do Pinterest nas imagens dos seus posts

Eu sei que as imagens do seus posts podem ser um chama enorme da multidão para seu blog, assim que você tomar esse passo à frente com a sua iniciativa e perder o medo de mexer no HTML do seu blog suas visitas aumentarão rapidinho. 
Pois agora, os blogueiros serão capazes de fixar um botão do Pinterest nas suas imagens de posts e quando seus visitantes gostam da imagem que verem lá, eles podem simplesmente apertar o botão vermelho para fixá-lo em sua conta do Pinterest também. Assim, todas aquelas pessoas que têm fixado a imagem agora podem ver a foto no seu painel. Ele não é restrito a isso apenas, em vez disso, eles também serão capazes de compartilhar a foto com os seguidores, bem como os amigos que eles têm. Se o visualizador tiver marcado a imagem ou se eles tiverem adicionado palavras-chave a ela, também será visível para eles. A melhor parte ainda não foi revelada, é que link da fotografia que dirige para o seu site vai levar uma pequena descrição sobre o seu blog ou um determinado posto seu. Então, agora você pode descobrir muito bem que se você estiver usando isso, então atrair novos visitantes será apenas uma questão de tempo antes que eles descubram seu site através do Pinterest.

Agora mãos a obra:

Agora que você sabe que um pequeno botão Pinterest pode ser tão útil assim, você gostaria de ficar longe dele? A resposta será grande "Não", mas como você faz isso acontecer? Você tem que começar por editar alguns códigos do modelo existente e para que isso aconteça, você terá que entrar no modelo do blogger.

Clique no botão que diz Editar HTML

Quando você entrar na página do editor, clique em qualquer lugar dentro do editor de HTML para habilitar a caixa de pesquisa e pressione CTRL + F e depois procure pela tag </body>

Agora você terá que fazer uso do script que é fornecido abaixo e colá-lo antes ou acima da tag encontrada (</body>) correto!

<script>
//<![CDATA[
var custom_pinit_button = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-F1AQKOfq67eNZzo9A-8pFT2kcoqZApft43iCpYRgzRnIcnSNaQE1rLvsGJBn9eL4JALaDlVjepF_F2bLxBYamnXn5rkaDA_0yYDNHxwcqkOFoz7XStdsoF7sD64i4zWwQsMWTtp5MMvO/s1600/pinit-button.png";
var pinit_button_position = "center";
var pinit_button_before = "";
var pinit_button_after = "";
//]]>
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<script id='pinit-img-button' src='http://makingdifferent.github.io/blogger-widgets/pinterest-button1.js' type='text/javascript'>
// Visit makingdifferent.com for more widgets and tricks.
</script>

Outra característica interessante sobre a coisa toda é que ele fornece flexibilidade suficiente na colocação do botão. Portanto, se você quiser que o botão esteja no centro, o script será...

var pinit_button_position = "center"

Mas, caso você queira colocá-lo em qualquer outro lugar, então substitua "center"  com a posição em que deseja que o botão esteja, ok.

topleft - em cima e no lado esquerdo
topright - em cima e no lado direito
bottomleft - em baixo e no lado esquerdo
bottomright - em baixo e no lado direito

Agora, se você quiser mudar botão Pin It para aparecer sobre o Mouseover, então você pode mudar a Url da imagem do botão "Pin It" é só procurar a linha do script...

var custom_pinit_button = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-F1AQKOfq67eNZzo9A-8pFT2kcoqZApft43iCpYRgzRnIcnSNaQE1rLvsGJBn9eL4JALaDlVjepF_F2bLxBYamnXn5rkaDA_0yYDNHxwcqkOFoz7XStdsoF7sD64i4zWwQsMWTtp5MMvO/s1600/pinit-button.png"

Antes de salvar as alterações feitas, você precisa revê-la para ver se tudo foi atualizado corretamente ou não. Se tudo tá então salve as alterações aí você pode passar o mouse na nas imagens dos posts, e então você vai saber se o botão Mouseover vermelho aparecer lá! Agora você pode verificar se seu tráfego está fluindo com a ajuda do Pinterest.

Até a próxima meus caros leitores e blogueiros.

Creditos: Making Different