Como Adicionar o Botão do Pinterest nas Suas Imagens
08/08/2013Nós já falamos do Pinterest por aqui algumas vezes, e como essa plataforma de rede social está crescendo de vento em polpa!! E você sabia que pode trazer mais tráfego para o seu site com o Pinterest do que com o Instagram? Pois é gente…hoje vamos ensinar como você pode adicionar o botão do Pin Pinterest diretamente nas suas imagens, facilitando assim as pessoas em darem um PIN na sua imagem!!
Existem aquelas barras de ferraments que ficam embaixo das imagens dos seus post que permitem às pessoas compartilharem os posts. Mas será que essa barra é o suficiente??
Lógico que você deve ter uma barra dos botões das redes sociais no final do post… ela pode sim lhe ajudar… mas colocando o botão do “Pin” diretamente na imagem é mais efetivo e mais rápido. Se um leitor entra no seu blog e vê uma imagen que ela quer adicionar no board do Pinterest, o botão se torna um processo muito mais rápido!
Então, vamos facilitar a vida do nosso leitor, certo?
Vamos adicionar o botão na propria imagem que ficará do lado, em cima.
Mas como adicionar esse botão na imagem??
Bom, começaremos com a pergunta simples: qual plataforma você usam – Blogger ou WordPress?
– Se você usa WordPress:
Como muitas e muitas coisas no WordPress, para você adicionar o botão do Pinterest na sua imagem você vai precisar de um plugin. Aqui no CBBLogers nós usamos o jQuery Pin It Button For Images. Existem muitos outros no mercado, e você pode ver essa variedade aqui no site wordpress.org no Pin It Button plugins available.
Cada plugin do “PIN” imagens terão funções diferentes. Alguns vão deixar você mover a localidade do botão do “Pin It” na imagem e alguns vão incluir uma posição já pré-determinada. Outro fator interessante do jQuery plugin, e alguns outros plugins também, é que ele deixa você desativar o plugin para certos posts e paginas. Então, se o seu site é do WordPress, ache um plugin que se encaixe nas suas necessidades.
– Para sites da plataforma do Blogger:
Para adicionar o botão do “Pin” no topo das suas imagens pelo site do blogger, você vai precisar modificar o código do seu template.
POR FAVOR: sempre dê um backup no seu template antes de fazer qualquer modificação nele!!
Nota: o código abaixo somente irá funcionar com templates estáticos do Blogger… ele não irá funcionar com dynamic templates do Blogger.
1. Backup o seu template: Clique no botão Backup Restore na pagina do Blogger template e salve o backup no seu computador. (precisamos colocar a imagem aqui!!)
2. Próximo passo você vai adicionar o codigo:
1.Clique em Editar HTML na página do template do seu blog.
2. Ache “” no seu Template. Você pode achar esse código clicando no “Ctrl F” . Clicando “Ctrl F” ele vai abrir uma caixa onde você vai colocar “” e clicar ENTER.
3. Quando você encontrar a tag “”, você vai entrar esse código que está aqui, mas EM CIMA da tag :
4. Ele deve ficar assim:
5. Clique em “salvar template”
6. Teste o seu site para verificar se tudo está no seu devido lugar, e pra ter certeza de que o botão do “Pin” está sendo mostrado nas suas imagens, basta passar o mouse por cima dela.
Prontinho!!
Você já tinha colocado o botão do “Pin” nas suas imagens?? Se já, você notou se existiu um aumento de tráfego pelo site do Pinterest?
CBBlogers by Michael
Deu certo!
Mas, você só me permite uma correção? Ao invés de “EM CIMA da tag” você deveria substituir por “ACIMA da tag”. A primeira expressão dá ideia que a tag deve ser substituída pelo código do botão, quando na verdade deve ficar acima desta “/body” ou depois de “body” .
Espero ter contribuído. Mais uma vez, obrigado pela dica!
Deu certo!
Mas, você só me permite uma correção? Ao invés de “EM CIMA da tag” você deveria substituir por “ACIMA da tag”. A primeira expressão dá ideia que a tag deve ser substituída pelo código do botão, quando na verdade deve ficar acima desta ou depois de .
Espero ter contribuído. Mais uma vez, obrigado pela dica!
olá! Eu fiz e deu certinho porém quando abro a postagem o botão não aparece nas imagens dentro da postagem, apenas lá na capa inicial do meu blog….é que meu blog mostra os resumos das postagens e, quando você entra em alguma postagem, não aparece o botão… como faço?
obrigada!
http://www.vidaloucadecasada.com.br/
AMEEEEIIII! Tinha tentado outro tutorial que deu errado, esse deu super certo. Obrigada!
Deu super certo e foi muito fácil, tinha testado uns três antes deste que não deram certo. Obrigada!
Amei a dica á está suuuper funcionando.Também valeu pla dica de com colocar o codigo para darem LIKE no Facebook!!