Tutorial: Comentários do facebook no blogger.

  Oi gente, tudo bem? 
  Várias blogueiros encontram diversos problemas para instalar os comentários do facebook no blog, afinal existe milhões de tutorias e grande parte deles tem erros! Por esse motivo eu elaborei um tutorial bem fácil e simples,  que qualquer pessoa vai conseguir colocar se seguir direitinho o passo a passo. Os comentários vão ficar igual esse:

Primeiro passo:

  Acesse o site Developers FacebookClique em criar um novo aplicativo:
  E preencha corretamente os campos abaixo:
  Depois é só clicar em "Criar Aplicativo":
  É importante deixar essa página aberta durante o processo de instalação.

Segundo passo:

  1. -Abra o Blogger, entre em Modelo > Editar HTML e aperte Ctrl+F 
  2. -Pesquise por <body ou <body> Embaixo desse código cole: 

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'APPID', // App ID
      channelUrl : 'htpp://www.seudominio.com/', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/pt_BR/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));

</script>

-As partes destacadas com essa cor devem ser substituídas. 
*Lembrando que o  "APPID" é disponibilizado no Developers.


Terceiro passo:

- Ainda no html aperte Ctrl+ f novamente
- Pesquise por: <data:post.body/> ou <div class=’post-footer-line post-footer-line-1‘/> 
- Embaixo do segundo data post cole:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/pt_BR/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>

<div class='fb-comments' data-colorscheme='light' data-num-posts='coloque aqui a quantidade de cometários que você quer apareça' data-width='tamanho do post no seu blog' expr:href='data:post.url'/> </b:if>

-As partes destacadas com essa cor devem ser substituídas. 

Bom meninas, é isso! Espero ter ajudado vocês.

Comente com o Facebook:

31 comentários:

  1. adorei o tuto!bj
    http://distractionsofaagirl-oficial.blogspot.com/

    ResponderExcluir
  2. Oi Marianne
    Eu particularmente ainda nao senti vontade de aplica-lo no meu blog.
    Talvez com tempo eu mude de ideia rsrs.
    Mais o post com as explicações e passo a passo está bem legal.
    Bjos A Moda In Foco

    ResponderExcluir
    Respostas
    1. Tem gente que não curte comentários do facebook mesmo, eu coloquei para facilitar a vida daquelas pessoas que não tem uma conta google!
      Que bom que você gostou do passo a passo!

      Excluir
  3. Amooo tutoriais pra blog, é meu assunto preferido dps de make claro!! Beijão, Carol do blog Red Lipstick

    ResponderExcluir
    Respostas
    1. Somos duas então!
      É sempre muito útil esse tipo de post né?

      Excluir
  4. Adorei a dica. Vou fazer no meu blog.
    Tudo o que acho é complicado. Mas achei o seu facinho.

    Beijos
    http://rodrigobandasoficial.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Fico feliz em saber que você gostou!
      Antes de eu começar a mexer com html todos tutoriais que encontra eu achava difícil também.

      Excluir
  5. Oii,

    Estou salvando aqui e vou tentar fazer. Adorei a forma como você explicou!!!

    Obrigada <3

    Beijinhos,

    EC&M

    ResponderExcluir
    Respostas
    1. Tenta sim, se precisar de ajuda estou a disposição.
      Tentei explicar do jeito mais simples possível haha

      Excluir
  6. Amei o tutorial!
    Beijos

    featglam.blogspot.com

    ResponderExcluir
  7. Amei o post bem explicadinho!!
    http://oficialgarotateen.blogspot.com.br/

    ResponderExcluir
  8. Que bacana.. vai ajudar muita gente :)

    www.chadecalmila.com

    ResponderExcluir
  9. Amei o tutorial flor, parabéns
    Beijos
    http://segredosdacahlima.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Fico feliz em saber que você gostou!
      Obrigada

      Excluir
  10. Eu tenho e adoro os comenarios via facbook... Mas as vezes o app da uns bugs... mas vale a pena!
    beijos
    www.salada-frutas.com.br

    ResponderExcluir
    Respostas
    1. Eu também gosto bastante,aqui nunca deu nenhum bug acredita?

      Excluir
  11. Oi Marianne olha eu aqui de novo.
    Tem uma surpresa pra você no meu blog.
    Ficou curiosa rsrsr? Corre lá e confere.
    Bjos A Moda In Foco

    ResponderExcluir
    Respostas
    1. Eba, adoro surpresas hahaha
      Vou agora mesmo conferir.

      Excluir
  12. Ola Linda, post super útil para as blogueiras de plantão! Hahaha
    Adoro esse tipo de dica :)
    Um beijão e até a próxima

    www.garotaurbana.com.br

    ResponderExcluir
  13. gente \o/ eu estava atrás desse tutorial a muito tempo ! muito útil !
    adoro tutoriais :) perfeita essa dica
    bjs
    http://rainhasdasdicas.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Sério?? Que bom!
      Fico feliz em poder te ajudar...

      Excluir
  14. Oi flor! Eu acho que quem tem um blog e pode fazer isso com certeza vai ajudar muito. No meu não consigo fazer porque é um site, e acho que não funciona. Você sabe informar? Super beijo diva!

    ResponderExcluir
  15. Você simplificou o que muita gente complica. Parabéns flor!

    ResponderExcluir
  16. Adorei o tutorial... queria muito instalar no meu, pena que no wordpress não dá :/
    Bjs

    ResponderExcluir
  17. Eu so tenho 1 duvida , por exemplo como faço para saber quando alguém comentou? Onde fica o sinalizador de comentário? Porque eu fiz um teste e fui ver na caixa de comentários e não aparece e também na caixa do face e não aparece , no aplicativo e não aparece. No caso onde fica o sinalizador das mensagens?

    ResponderExcluir
  18. Adorei o post, muito bom. Pena que sou burrinha neste assunto rsrs sempre gostei disso.

    http://capricheinlife.blogspot.com/

    ResponderExcluir

Leiam o post inteiro, pois ele foi escrito com muito carinho para vocês! Se gostarem comentem e curtam o post.
Obrigado pela visita e volte sempre.

Related Posts Plugin for WordPress, Blogger...