CBBlogers

Dicas Tech

Como Adicionar o Botão do Pinterest nas Suas Imagens

por Michael Jacobs em Dicas Tech, Imagens, Mundo do Blog, Redes Sociais

agosto 8, 2013 20

pin buttom pinterest dica tech cbblogers

Nó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!

Botão do Pinterest

Então, vamos facilitar a vida do nosso leitor, certo?

Vamos adicionar o botão na propria imagem que ficará do lado, em cima.

Botão do Pinterest na Imagem

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.

jQuery Pin It Button WordPress plugin

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!!)

Pin Pinterest 01

 

 

Pin Pinterest 02

 

2. Próximo passo você vai adicionar o codigo:

1.Clique em Editar  HTML na página do template do seu blog.

Pin Pinterest 03

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:

pin it button code

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

Facebook / Twitter Pinterest Instagram

Comentários

  1. Foto de perfil de Andreia

    Olá Meninas
    Preciso da ajuda de vocês.
    Minha webdesigner não consegue instalar o botão do pintrest pois ela alega que nessa versão nova do Blogger não aceita esses códigos. Eu não encontrei essa opção “” no meu Blog. Como eu faço para conseguir instalar?
    Bjks
    Andreia Sales

    Responder
  2. Foto de perfil de Maria José Leite

    Não tem/não encontrei a tag “” no html do meu blog.

    Responder
  3. Meninas, o nome da tag é:
    O código é colocado em cima dele hahah (=

    Responder
  4. Foto de perfil de ideiasdiversas

    Nossa! Estava procurando esse assunto essa semana. Obrigada pelo esclarecimento de minha dúvidas! Bjs

    Responder
  5. Foto de perfil de ideiasdiversas

    correção: *das minhas dúvidas!

    Responder
  6. Foto de perfil de polyana

    amei deu certo e não deu trabalho foi super facil obbrigada

    Responder
  7. Amei a dica á está suuuper funcionando.Também valeu pla dica de com colocar o codigo para darem LIKE no Facebook!!

    Responder
  8. Deu super certo e foi muito fácil, tinha testado uns três antes deste que não deram certo. Obrigada!

    Responder
  9. Foto de perfil de Hevelyn

    AMEEEEIIII! Tinha tentado outro tutorial que deu errado, esse deu super certo. Obrigada!

    Responder
  10. Foto de perfil de Renata Becker Wentz

    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/

    Responder
  11. 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!

    Responder
  12. 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!

    Responder
  13. Olá,
    Tenho um blog no blogger, fiz tudo certinho mas agora meu blog não abre mais. O que faço?

    Responder
  14. Deus super certo, muito simples e não tem erro. Obrigada!
    Leli Freitas.

    Responder
  15. corrigindo: Deu super certo*

    Responder
  16. CBB rocks!! Unico link que testei e funcionei.

    Responder
  17. Pesquisei tanto e não conseguia colocar o botão de Pin it no meu blog, até encontrar seu artigo. Mais simples do que eu imaginava rs…obrigada!!!

    http://www.polaroidscotidianas.com

    Responder
  18. Preciso agradecer vocês, estão me ajudando demais com tantos posts legais e super uteis aqui! Vou fazer isso agora! 🙂

    Beijos
    http://suchaprettyday.com

    Responder

Deixe um comentário

O seu endereço de email não será publicado.


*


#CNB2018 - VÍDEO OFICIAL
  
Pular para a barra de ferramentas