Postado por Matheus Vitor
           Atendendo agora o pedido de uma amiga aqui do blog, resolver trazer esse tutorial para vocês.
Já tinha esse Post guardado em rascunho, só estava esperando a hora certa de trazer para o mundo! é um tutorial grande e cansativo! espero que gostem.
          Vamos lá!!

No ano de 2013 o Blogger deu uma re-paginada em sua estrutura, causando alguns transtornos para os usuários, um deles, foi o problema com os comentários do Facebook no Blog. Por isso trouxe esse tutorial já atualizada e funcionando.


1º - Faça login no seu Facebook(sim, o seu perfil de todo dia) depois clique nesse link:


Aqui você irá criar um aplicativo, por isso atenção! 


Clique no botão: " + Criar Novo Aplicativo" Vai abrir uma pop-up:


 Preencha os dois primeiros campos, eles precisam ficar com o nome verde, para serem aprovados! Depois é só clicar em continuar. Digite o código na tela seguinte e dê Continuar.



 Pronto, você acabou de criar um aplicativo. Agora anote o número que aparece, pois ele será muito importante mais a frente. 
               Agora vamos voltar ao seu painel do Blogger, Clique em Modelo > Editar HTML. Depois de abrir seu código HTML, dê F3 e procure por:

<head>

E abaixo dele cole esse código, e não esqueça de colar o IP do aplicativo que você criou:

<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='AQUI O NÚMERO DO APLICATIVO DO FACEBOOK' property='fb:admins'/>

Agora, clique no botão: "Ir para um widget" e selecione Blog 1.





Clique na setinha preta do lado para expandir. Depois procure por esse trecho:

<b:includable id='comments' var='post'>

Clique novamente na setinha ao lado desse trecho. E cole este código logo abaixo trecho acima:


<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='52' width='560'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'/>

Salve! E pronto! Espero que tenham gostado, qualquer dúvida, sugestão, deixe uma comentário, não tenha vergonha! Até

Ou Veja o Video Encinando ;)


40 comentários:

  1. Valeu pelas dicas fera!!!...mais infelizmente não funcionou, fiz tudo certo encontrei todas os códigos que você passou, salvei mais não aparece nada no meu blog, fiz exatamente como o seu tutorial em vídeo e não funcionou. pode ser alguma coisa no template que esteja dando pau...porque já tentei o botão curtir...agora o dos comentários e nada da certo...vou continuar tentando até conseguir achar algo que apareça...se você poder me ajudar com novas dicas da uma olhada no meu blog http://humordicasnoticias.blogspot.com.br/ abraço t+++

    ResponderExcluir
    Respostas
    1. Cara!!! Isso pode ser que os códigos sejam incompatíveis com seu template... Eu tinha um template que não funfava os codigos curtir e compartilhar (compartilhar so dava de outro jeito)...

      Ai eu mudei meu template e funfou numa boa...

      Excluir
  2. CARA EU CONSEGUI, MAIS DEPOIS SUMIU PQ? TENHO QUE FAZER ISSO TODA VEZ???

    ResponderExcluir
  3. No caso do meu blog não deu certo eu fiz igualzinho você falou mas apareceu uma mensagem assim ''The widget with id "Blog1" cannot contain element: "div". A widget can only contain b:includable elements'' poderia me ajudar???

    ResponderExcluir
    Respostas
    1. Cara isso é fácil... Ou vc adiciona o < /div > e o < /b:includable > no final do código...

      Ou vc coloca novamente o .xml e faz tudo de novo....

      Excluir
  4. oi Matheus,
    você tá recebendo as notificações quando alguém faz algum comentário?

    ResponderExcluir
  5. Eu queria na cor branca! troquei a palavra width por light e continuouu preta! não sei o que fazer me ajuda!?

    ResponderExcluir
    Respostas
    1. width não é a cor, é a largura. para dizer branco é "white"

      Excluir
    2. Oi! Vc mudou "Width" para "Light".... Errado!!!

      Coloque o primeiro no segundo e o segundo no primeiro.....

      Para deixar branco procure o seguinte código: Tecle Ctrl + F e digite: data-colorsheme="dark" ou apenas colorsheme="dark" ou apenas "dark"...

      Mude o nome dark para light.... E pronto!!! Está feito....

      Excluir
  6. eu também queria na cor branca!!! ajude-nos

    ResponderExcluir
  7. Valeu demais brother... Procurei todo tipo de tutorial, nenhum funcionou, só o seu. Parabéns!

    ResponderExcluir
  8. nao funciona, nada disso que vocês ensinam funcionam, vao aprender antes de ficar ensinando e fazendo os outros de trouxas

    ResponderExcluir
  9. Valeu mesmo, eu consegui mas, como tiro isso:

    Acesse o Artigo Original: http://uddesignerr.blogspot.com/2013/08/comentarios-do-facebook-no-blogger.html#ixzz2l6i7THLS

    ResponderExcluir
  10. não funcionou no meu :$

    www.oquefaltou.com

    ResponderExcluir
  11. eu coloquei mais aparece dua vez no blog para comentar o que faço ???

    ResponderExcluir
  12. cara vlw mesmo deu certo mas ficou as duas caixas de comentários a do blog e a do facebook, como eu tiro a do blog?

    ResponderExcluir
  13. Olá! O seu tutorial foi o primeiro que fez a caixa de comentários funcionar! Porém quando alguém comenta com o sistema de comentários blogger, o sistema do facebook desaparece. Você saberia me dizer como mudar isso? Obrigada!

    ResponderExcluir
    Respostas
    1. Olá, eu tenho o mesmo problema que a Ana.
      Será que nos podia ajudar a resolver esta situação?
      Obrigado.

      Excluir
  14. Perfeito.. tem tutoriais que alem de não funcionarem, quando funcionam o mesmo comentário aparece em cada postagem do blog.. MAS ESSE FUNCIONOU DE CARA.. PARABÉNS! MUITO BOM!

    ResponderExcluir
  15. Gente me Add no Facebook Que Vou estar Ajudando vcs !

    ResponderExcluir
  16. Boa noite ! Eu tive um grande problema com o sistema de comentários do facebook no blog, exemplo: comentários que se repetiam,códigos que não funcionavam e etc.
    Aviso! tem tipos de templates que não suportam o tipo de códigos isso é um fato eu fiz centenas de testes. Atualmente eu estou fazendo os meus templates e apliquei esse código acima e funcionou "corretamente". valeu brother e até mais.

    ResponderExcluir
  17. Matheus, conseguiu resolver o problema sobre receber e-mails com os comentarios?

    ResponderExcluir
  18. Betto, como fez pra colocar a cor Branca na letra?

    ResponderExcluir
  19. Nossa eu boiei geral em tudo tentei um milhão de vezes! preciso de ajuda

    ResponderExcluir
  20. segui todos os passos mas nao apareceu nada! O que fazer?

    ResponderExcluir
    Respostas
    1. Vc Deve Ta Usando o GoogleChome , Ele Esta Com Uns bugs , Recomendo usar O Opera Ater ele Voutar !

      Excluir
    2. Como Ja Disse Vc Deve Ta Usando o GoogleChome , Ele Esta Com Uns bugs , Recomendo usar O Opera Ater ele Voltar !

      Excluir
    3. Como Ja Disse Vc Deve Ta Usando o GoogleChome , Ele Esta Com Uns bugs , Recomendo usar O Opera Ater ele Voltar !

      Excluir
  21. Valeu eu consegui :))) visitem meu blog de animes http://animagle.blogspot.com.br/

    ResponderExcluir

Regras dos comentários

1. Todos os comentários são lidos e se possível respondidos.
2. Não serão toleradas faltas de respeito.
3. Se possível comente e faça de nós um grupo feliz.
4. Caso comente como Anónimo o seu comentário será anulado!
5. Caso o link não Esteja Pegando Deixe um comentário avisando!

Obrigado

 
Top