Como adicionar o botão Curtir do Facebook dentro das postagens do Blogger



O Facebook é a maior rede social do mundo e a que mais cresce. No Brasil, o crescimento do Facebook está sendo constante e muitas empresas aproveitam todo esse tráfego de pessoas online para divulgar suas marcas, seus produtos, serviços e afins. Tenha sempre certeza que seus visitantes terão uma conta no Facebook e, se você criar uma página lá, e divulgar seu conteúdo, você poderá também aproveitar todo esse tráfego e trazê-lo para seu blog. Por isso, adicione um botão curtir do Facebook em seu blog no Blogger já!


Não tem nada de complicado, vá até seu Blogger e clique em:


Agora, procure por:

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

Se você não encontrar, procure pelo mesmo código, só que com a barra no final:

<div class='post-header-line-1'/>

Nós mostraremos os três principais tipos de botões para Facebook, os mais usados e os melhores. São eles vertical, horizontal e o horizontal sem contador de "curtidas".


Botão Curtir do Facebook com contador - Vertical

Botão Curtir do Facebook com contador - Vertical
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>

Botão Curtir do Facebook com contador - Horizontal

Botão Curtir do Facebook com contador - Horizontal
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/> </b:if>

Botão Curtir do Facebook sem contador

Botão Curtir do Facebook sem contador
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/> </b:if>

Agora sim, seus leitores podem compartilhar os artigos do seu blog no Facebook.
Teve algum problema ao inserir o botão? Deixe seu comentário que, na medida do possível o ajudaremos!

148 comentários:

  1. Wil, excelente. O seu foi o único que "deu certo" em meu Blog. Obrigado!
    Sem querer abusar, mas os botões do Google+ e do Twitter.. você teria algum post também pra nos auxiliar a inseri-los. Abraços

    ResponderExcluir
    Respostas
    1. Edson, obrigado pelo comentário e que bom que deu certo.
      Logo prepararei um post com o do Google+ e do Twitter, bem legal.

      Abraços!

      Excluir
    2. sera que seria abusar da sua vontade se eu pedisse pra voce linkar meu blog e que criei agora e queria uma ajudinha

      se poder o link e esse

      Http://www.comandoaprender.blogspot.com

      Excluir
    3. ahhh.. eu nao consegui... nao achei!!

      Excluir
  2. Wil, não vejo a hora dos demais códigos. Grande abração na alma.

    ResponderExcluir
  3. Muito bom esse código legal já está no meu blog valew

    ResponderExcluir
  4. muito obrigado, foi o unico codigo que funcionou no blog, valeu mesmo!!! vc tem o codigo do pinterest?

    ResponderExcluir
  5. Muito bom funcionou direitinho!!
    Também gostei da sua frase "UM Blog para seu Blogger"

    Obrigado.

    ResponderExcluir
  6. Obrigada vlw funcionou.
    http://quenomeeudou123.blogspot.com

    ResponderExcluir
  7. Muito fácil e muito obrigada haha
    enxergarsemver.blogspot.com.br

    ResponderExcluir
  8. Simplesmente fenomenal muito Obrigado, só achei aqui, Muito grato você é de mais valeu

    ResponderExcluir
  9. NÃO CONCEGUI TERMINAR POR QUE NÃO VI O FINAL DA POSTAGEM

    ResponderExcluir
  10. acho que sou mais lerda que os demais. Nao entendi bem. Depois que seleciona a caixa expandir modelos de widgets, eu procuro por aqueles negocinhos e aí, faz o que?

    ResponderExcluir
  11. Boa noite. Tentei colocar o botão curtir sem contador em meu blog, porém, o número de pessoas que curtiram segue aparecendo. Gostaria realmente de um botão que não mostrasse essa quantidade, uma vez que ela constantemente é apresentada com erros. Um abraço

    ResponderExcluir
  12. muito bom, bem do jeito que queria... mas queria no FIM DO POST,e ta ficando no inicio.. sabe como resolvo?
    bjs

    ResponderExcluir
  13. cara excelente! mas criei uma pagina nova no blog e o botão não aparece nela.... alguma ideia de como faço para o botão ir pra lah tbm??

    ResponderExcluir
  14. Não achei essa linha de código que disse, ja procurei em toda HTML não encontrei :(

    ResponderExcluir
    Respostas
    1. Também não encontrei.. já procurei diversas vezes e não encontrei nenhum dos dois códigos que ele mencionou :(

      Excluir
  15. Show. Funcionou comigo tb, valeu pela dica

    ResponderExcluir
  16. Eu simplesmente estou amandoooo ja estou me sentindo uma blogueira kkkkkkkk funcionou

    ResponderExcluir
  17. Parabéns Will, de forma simples e bem esplicado ..show de bola

    ResponderExcluir
  18. Me ajudou bastante Wil, Deus lhe abençoe em tudo

    ResponderExcluir
  19. muito obrigada! adorei foi simples e facil

    ResponderExcluir
  20. Gostaria de saber como configurar o botão para que ele apareça sempre a direita.
    No meu blog ele só aparece a esquerda e o layout fica comprometido.
    Espero que possa me responder, pois o seu foi o único que funcionou.

    Obrigado!

    ResponderExcluir
    Respostas
    1. Renata, basta fazer o seguinte:


      <div align=”center”> código do widget </div>

      Onde está escrito "Código do Widget" é onde você deve colocar todo o código do botão Curtir do Facebook.

      Espero ter ajudado!

      Excluir
    2. Wilamis, o botão ficou acima de minha postagem, perto do titulo, poderia me ensinar a colocar no final da postagem, perto dos comentários e compartilhe? Obrigada!

      Excluir
  21. Deus certo wilamis, mas onde está
    -”center”- deu erro,ai tive que tirar as aspas e colocar 'center' isso fez com que o botão ficasse no centro, depois disso foi só trocar center por right.

    Muito obrigado!! Valeu mesmo, sucesso.

    ResponderExcluir
    Respostas
    1. Que bom que deu certo, Renata!

      Obrigado e boa sorte com seu blog também!

      Abraços! ;)

      Excluir
    2. Willian nao consegui, é pra substituir ? e no meu blog não consta esse div class, o meu aparece assim div class='widget-content'>


      alguma sugestão? abç

      Excluir
    3. Willian nao consegui, é pra substituir ? e no meu blog não consta esse div class, o meu aparece assim div class='widget-content'>


      alguma sugestão? abç

      Excluir
    4. Bruno, você expandiu os modelos widgets?

      Excluir
  22. não tem como centralizar embaixo do post a opção ?

    ResponderExcluir
  23. Wil, como faço para que o Botão de Curtir apareça no fim do post, e não no inicio?

    ResponderExcluir
  24. muito obrigado, ja tinha tentado varias vezes e não tinha dado certo. agora consegui obrigado, estou te seguindo se der me segue tbm ;)

    ResponderExcluir
  25. Nooossa! Verdade o que as pessoas estão comentando, o seu foi o único que deu certo para mim também. Muuuuito obrigada!

    Uma dúvida: Quando as pessoas clicam no botão de curtir pede uma confirmação. Teria como curtir apertando o botão somente uma vez? Porque tenho receio que as pessoas não prestem atenção e deixem de corfirmar.

    ResponderExcluir
    Respostas
    1. Giliane, obrigado!

      Eu ainda não consegui um que retire essa confirmação.
      Quando conseguir posto aqui no blog.

      Abraços!

      Excluir
  26. Funcionou perfeitamente. Obrigado pela ajuda! Blog Incruzão Dijitau...

    ResponderExcluir
  27. obrigado resolvido o problema meu ! só queria que mostrasse a foto dos seguidores do facebook tem como?

    quem precisar de drivers, e programas grátis.

    www.baixedegratis.com.br
    www.baixedegratis.com

    ResponderExcluir
  28. muito obrigado acabou com todas as minhas duvidas agora qualquer duvida que eu tiver vou vir logo nesse site parabens

    ResponderExcluir
  29. Tem alguma maneira de que o contagem das curtidas seja individual por post?

    ResponderExcluir
  30. Olá Wilamis!
    Obrigadão mesmo!!
    botão otimo e com essas opções ficam demais no blog
    mas 2 duvidas
    1ª - já conseguiu descobrir como "pular" a confirmação do like?
    2ª - tem como colocar os rostos ou nome de quem curte? já troquei o Show_faces para =true, mas não funcionou.

    Abraço

    ResponderExcluir
  31. Me ajudou muito!!! **Galera, é pra colar o código do lado do que vc procurou**
    Vlw!!

    ResponderExcluir
  32. nao deu erro, mas nao apareceu o botao do curtir do face

    ResponderExcluir
  33. OBRIGADA AMIGOO!!! VALEU AJUDA!!!

    SE QUISER CONFERIR, VISITE O BLOG RENOVADA FITNESS

    ResponderExcluir
  34. Garoto, vc é um gênio...explicou muito bem explicadinho...bati cabeça o dia todo só pegando posts furados...só o seu é que ddeu certíssimo...Valeu! Olha como ficou show: wwww.coisasdemulherecia.blogspot
    Brigaduuuuuuuuuuu....

    ResponderExcluir
  35. Maravilha! Só tem um detalhe. Precisa concluir a orientação, porque você diz para localizar o <div class etc e não diz se é para substituí-lo, se é para colar o código abaixo dele nem nada, daí a gente fica perdidíssimo!

    ResponderExcluir
  36. Nossa show esse seu blog. Me ajudou muito. Procurei por vários sites e nenhum foi tão bom quanto o seu para que eu pudesse colocar o curtir. Parabéns!!!!!Obrigada

    ResponderExcluir
  37. Muito bom, mas sabe como colocar ao final do post e não no cabeçalho? Grato.

    ResponderExcluir
  38. Encontrei o código div class='post-header-line-1...agora não entendi onde colo o código do "Botão Curtir do Facebook com contador - Horizontal"...falta finalizar.Por gentileza me explique????

    ResponderExcluir
  39. Willian, tem como colocar o botão sem precisar confirmar o curtir? Por exemplo, quando eu clico em CURTIR aparece "CONFIRMAR" daí abre uma pagina do facebook e aparece 'confirmar curtir'
    Sabe se tem como tirar isto? Grato, vitor.

    ResponderExcluir
  40. adorei, mt fácil!

    vc tem tutorial para colocar a caixa de comentários do face no blog???

    ResponderExcluir
  41. nosso gostei muito deste blog este gadget ja esta no meu blog de uma olhada http://brtemplates.blogspot.com.br/ cobe sertim do jeito que eu queria brigado

    ResponderExcluir
  42. Vllw Wil! Foi o único site que eu aprendi a adicionar o botão curtir nas postagens do meu Blog! Parabéns!
    Muito Grato!

    ResponderExcluir
  43. encontrei o código no html e agora?

    ResponderExcluir
  44. Wilson, este deu certo. Parabéns!!!
    E como faz pra colocar a opção curtir pagina do facebook no site?
    Obrigada.
    Wiviane

    ResponderExcluir
  45. Desculpe minha ignorancia, mas eu fiquei "agarrado" depois da instrucao para procurar a linha (div class='post-header-line-1'/) e depois voce mostra os codigos dos botoes. Mas eh para substituir a linha, colocar o codigo antes? depois? onde? Obrigado.

    ResponderExcluir
  46. Gente, sou meio lerda, mas depois que eu encontrei o HTML não sei mais o que fazer... me ajudem por favor!!!!

    ResponderExcluir
  47. cara vc ta de parabéns ótima postagem
    ja esta funcionando no meu blog super rapido e pratico
    muito obrigado

    ResponderExcluir
  48. Muito obrigada! Deu certinho!!
    Só esclarecendo os marinheiros de primeira viagem como eu! rsrs!
    Quando encontrar o código, é pra substituir!

    Excelente blog, obrigada!!

    ResponderExcluir
  49. Wil parabéns pelo seu trabalho, tem apenas uma semana que entrei nesse "mundo" dos blog's. Bem vamos ao ponto, rs; eu instalei a rolagem infinita e tanto o curtir do Face, qto o botão de impressora só aparecem nos post's iniciais depois eles não aparecem nos demais post's. Você teria uma solução p/ esse probema... Te agradeço desde já.

    ResponderExcluir
  50. Muito obrigado, Wilamis! tinha tentado um monte por aí e nenhum estava dando certo! Com a sua explicação, foi rápido e eficaz! ;)

    ResponderExcluir
  51. nao consegui !!!
    no achei esse codigo q ta falando ai em cima :/

    ResponderExcluir
  52. Eu havia colocado o botão, estava funcionando legal, mas aí de repente parou, ele não curte mais o post e sim a página. Como faço pra voltar a curtir somente o post?? Meu blog é http://fenix-renovacao.blogspot.com.br/ desde já agradeço!

    ResponderExcluir
  53. é para substituir a linha com o código?

    ResponderExcluir
  54. Obrigado, muito fácil de instalar, quebrou mais galho :)
    http://cronicasdeayrim.blogspot.com.br/

    ResponderExcluir
  55. Excelente. Foi o único que deu certo no meu blog. Obrigada.

    ResponderExcluir
  56. Você é o caraaaaaaaaaaaaaaaaaaaaaaaa muito obrigada !
    Unico que aprendi

    ResponderExcluir
  57. Tem algum codigo que uso para tirar a opção de confirmar tanto para curtir qto comentar ou compartilhar, no meu blog tem um botao para curtir que necessita de cofirmação e tem um comentar que tambem necessita de confirmação. Gostaria de tirar as confirmaçôes.Poderia me ajudar?
    grato.

    ResponderExcluir
  58. vlw !

    Só estou tendo um problema quando alguem curte ele pede para confirmar, sabe como tirar isso ?

    ResponderExcluir
  59. Nossa... Obrigada!!
    Parabéns! esta ajudando muito, e ajudou nossa empresa!

    Agora podem curtir http://g1moveis.blogspot.com.br/

    ;*

    ResponderExcluir
  60. Muito bom estava procurando a um tempo e este deu certinho!
    Abraços

    ResponderExcluir
  61. Não consegui aqui! Tentei a tag div mas mesmo assim não aparece. O que posso estar fazendo errado?

    ResponderExcluir
  62. Valeu deu muito certo, até que em fim, Obrigada pelas dicas e já querendo outra: Vejo no Facebook que muitas pessoas colocam uma tag de responder no seu comentário (ficando logo abaixo do seu comet) mesmo que outra pessoa já tenha comentado alguma coisa. como faço isso? Deu pra entender?? Há igual esta aqui no seu bog que posso responder o coment dos outros.

    ResponderExcluir
  63. NÃO DEU CERTO NO MEU BLOG GOSTARIA QUE ME AJUDASSE

    ResponderExcluir
  64. O meu deu certo só que ele aparece ao lado do título, como faço para ele ficar lá embaixo junto com os outros ícones [ao lado de comentários]???

    ResponderExcluir
  65. amigo obrigado mesmo mas não deu certo p mim

    ResponderExcluir
  66. Olá, muito legal a ajuda! Mas como eu assino meus posts em cima, porque tenho mais que uma autora, a opção curtir ficou la em cima, antes do post... onde eu poderia colar pra que ficasse no final, perto dos comentarios? Obrigada!

    ResponderExcluir
  67. Will... acho q mudaram a interface do blogger...
    1o. nao tem mais a caixinha de expandir o modelo... e além disso, acho que meu layout nao me permite adicionar, pq eu ja tentei de varias maneiras, e nada aparece!
    :(

    ResponderExcluir
  68. Alguem sabe como tirar a confirmação?
    o meu pede confirmação apos curtir ou apos eu comentar algo.
    em varios blogs nao precisa de confirmar, como faço para tirar isso.

    ResponderExcluir
  69. Horas mexendo nessa parada e nada!!!!
    Não entendi patavinas disso!!!
    To desistindo agora, não deu certo!!!

    ResponderExcluir
  70. Que saco, não encontro essa opção: •Marque a opção "Expandir modelos de Widgets

    ResponderExcluir
  71. Não achei isso Marque a opção "Expandir modelos de Widgets" :(

    ResponderExcluir
  72. Muito obrigado pelas explicações, pois consegui fazer sem complicações.

    ResponderExcluir
  73. Oi! Tudo bem? Olha não encontro mais a opção "Expandir modelos de Widgets" e também não encontro nenhuma das duas opções de códigos.
    O que será que esta acontecendo?

    ResponderExcluir
  74. não funcionou =/ não sei onde errei, tentei de outras formas mas não deu.
    mangadesignbr.blogspot.com

    ResponderExcluir
  75. Obrigaddddddddddddddaaaaaaaaaaaaaaa!!!! Até que enfim conseguiiii...

    ResponderExcluir
  76. Cara, ele está aparecendo em cima e eu queria que ele ficasse no fim do post, como faz?

    ResponderExcluir
  77. Não consegui porque não existe mais o "expandir gandgets" está diferente o blog de novo

    ResponderExcluir
  78. Olá amigo, como faço para inclui o botão "curtir página" dentro do meu post no facebook. Criei uma pagina de vendas de importados, e uso o hootsuite, no entanto eu gostaria de colocar este botão curtir para que aumentasse o nº de curtidas. Valeu.

    ResponderExcluir
  79. se você não sabe procurar muito rápido(o codigo que ele falou), clique Ctril+F e digite o codigo ;)

    ResponderExcluir
  80. Não consigo colocar, não encontrei o codigo!

    ResponderExcluir
  81. Eu mesma curti para ver se tava certinho.. mas não publicou no meu mural...

    ResponderExcluir
  82. Estou com a nova interface do Blogger e não tem mais aquela opção de expandir widgets. Não consigo encontrar o código daí. Sabe como faz nessa nova interface?

    ResponderExcluir
  83. No meu blog simples eu consigui inserir, só que agora eu troquei meu template e não apareceu nada tentei de diversas formas, poderia me dar uma atenção nessa dúvida, obrigado!

    ResponderExcluir
  84. Não consegui achar o código...alguém pode ajudar? Obrigadoooo.

    ResponderExcluir
  85. No meu não tem a opção expandir Widget .Onde eu encontro isso ?

    ResponderExcluir
  86. Gente, deu super certo... eu estava copiando o nome do meu blog, mas na verdade vc tem que entrar na sua página do facebook e copiar o nome da sua página.
    Aff... como fui bobinha...rsrsrs

    ResponderExcluir
  87. po acho que sou o unico que não conseguiu, apareceu tudo, colei lá, só nao aparece o botao like

    ResponderExcluir
  88. coloquei logo apos o codigo e nao aparece nada, pode me ajudar, valeu

    ResponderExcluir
  89. Não estou encontrando o "prosseguir" que você mencionou!!

    "clique em Editar HTML > Prosseguir"

    E ainda assim procurei o código que você falou, mas não achei também!! :(

    Me ajudaa por favor!

    ResponderExcluir
  90. Wil, quando a pessoa clica no botão curtir ele pede para confirmar e aí a pessoa tem que clicar novamente. Isso é normal ou fiz algo errado? Obrigado.

    ResponderExcluir
  91. é pra colocar ao lado,abaixo ou aonde do código ? :s
    http://garotas--poderosas.blogspot.com.br

    ResponderExcluir
  92. Até que enfim funcionou! rsrs
    Parabéns!

    ResponderExcluir
  93. Finalmente, risos.
    Obrigada, parabéns e sucesso!

    ResponderExcluir
  94. Amigo, depois que vou no html e encontro a tag div class='post-header-line-1'/ faço o que? você não diz se é para substituir esta pelo código do botão curtir, fornecido por você, ou se coloco a tag do botão curtir depois do div class.......

    ResponderExcluir
  95. deu certo
    obrigada.

    ps:por um acaso vc não saberia o porque que quando coloco a caixa de mensagem do face no meu blog não esta aparecendo??

    ResponderExcluir
  96. Wilamis,

    Já procurei várias vezes esse código e não encontro por nada!
    vi que tem que expandir os widgets, como eu faço isso?
    Me ajude!!!! :(

    ResponderExcluir
  97. como faço para expandir os widgets?
    não estou conseguindo, depois que clico em edital HTLM não aparece a opção prosseguir e nas opções abaixo, nãom aparece o div class =post-header. o que fazer?
    obrigada

    ResponderExcluir
  98. No meu não vai, coloco eles e não vão!!!

    Ja tentei de vários blogs por ai como eles ensinam e não aparece no final de cada postagem,
    AJUDE-MEEE!

    ResponderExcluir
  99. Não consegui colocar na direita de jeito nenhum ): Mas funcionou :D

    ResponderExcluir
  100. Olá! O meu não apareceu dentro das postagens. Ficou fora. Por favor, como faço para que apareça dentro das postagens? Obrigada!

    ResponderExcluir
  101. Sensacional deu certo...
    saudações Blog AED Tecnologia.

    ResponderExcluir
  102. Encontrei a tag no blog, e agora, colo o código fonte do facebook, antes ou depois dela?

    ResponderExcluir
  103. Não deu certo,procurei em vários lugares e não deu certo. Fiz tudo direitinho e nada. O que será? Mais parabéns o post está bem, explicadinho!

    ResponderExcluir
  104. como colocar botão curtir e compartilhar nas postagens do blog?

    ResponderExcluir
  105. Olá, gostaria de saber se existe a opção para colocar CURTIR + Contador e COMPARTILHAR juntos ?

    Desde já agradeço!

    ResponderExcluir
  106. É possível incluir os dois botões juntos, tipo botão COMPARTILHAR + botão CURTIR com contador?

    Se puder me ajudar não consegui agrupar os códigos.
    Parabéns pelo blog!

    ResponderExcluir
  107. Olá tudo bem? Não estou conseguindo... é depois do div class='post-header-line-1'/ ? fiz assim mas não tá rolando. Poderia me ajudar please?


    ResponderExcluir
  108. Olá, Wilamis!

    Obrigada por compartilhar essa informação! Deu certo no meu blog!

    Abraços,
    Roberta

    ResponderExcluir
  109. Me desculpe, mas onde devo colocar este botão?Em cima do código que você deu, embaixo ou terei que substituir?

    ResponderExcluir

Visualizações dinâmicas

Arquivo do blog

Estamos aqui também

Copyright© 2010 - 2013 - Redes e Blogger - Todos os direitos reservados.

Redes e Blogger é orgulhosamente desenvolvido com Blogger


Termos de uso | Política de Privacidade | Mapa do blog

Template by Dicas Blogger | Modified by Wilamis Rogério