CPT - Centro de Produções Técnicas

Comentários do Facebook + moderador no Blogger


Pra começar, você deve entrar no site "Developer Facebook".

No topo da página você vai encontrar o link "My Apps". Clique nele.
Faça login com sua conta do Facebook, você será direcionado para sua página do Face, volte para a página do Developers e continue o processo.
Mas talvez você não encontre essa opção (veja na foto abaixo), então na caixinha de pesquisa ao lado pesquise por "My Apps". A caixinha mostrará algumas opções, não clique em nenhuma, aperte na lupa para pesquisar.


Vai abrir uma caixa pedindo para se registrar. Depois de registrado, abrirá essa página.


Clique em "WWW Website", depois em "Skip and Create App ID".
Abrirá outra caixa, dê um nome de exibição, não importa o nome.


Em "Namespace" não precisa colocar nada. Escolha uma categoria. Depois clique em "Crie um ID do aplicativo". Vai abrir uma caixa pedindo para colocar letras ou selecionar fotos.

NÃO saia da página que abriu, você vai precisar do APP ID que foi gerado.

Abra o blogger numa nova aba, clique em modelo / editar HTML. 

Dê um clique dentro da caixa onde fica o código HTML, clique Ctrl+F, vai abrir uma caixinha de pesquisa dentro.

Procure por:  <body ou <body>

Abaixo cole:

<div id='fb-root'/> 
   <script> 
    window.fbAsyncInit = function() { 
     FB.init({ 
      appId   : &#39;IDDOAPP&#39;, // App ID 
      channelUrl : &#39;//www.seudominio.com/channel.html&#39;, // 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 = &#39;facebook-jssdk&#39;, ref = d.getElementsByTagName(&#39;script&#39;)[0]; 
      if (d.getElementById(id)) {return;} 
      js = d.createElement(&#39;script&#39;); js.id = id; js.async = true; 
      js.src = &quot;//connect.facebook.net/pt_BR/all.js&quot;; 
      ref.parentNode.insertBefore(js, ref); 
     }(document)); 
   </script>  


Observe no código acima um pedaço em negrito e vermelho, é ali que você deve colocar seu ID, aquele gerado no Developers Facebook.

Na parte destacada de verde, você deve colocar sua URL, sem o http.

 
Depois procure por:


<div class='post-footer-line encontrando esse código, logo abaixo vai estar o
line-1 dê um enter, vai estar o 2 dê um enter.

Assim: <div class='post-footer-line post-footer-line-2'/>
 

Cole acima: do line 2

<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='NÚMERO DE COMENTÁRIOS' data-width='TAMANHO' expr:href='data:post.url'/> </b:if> 
 

Neste código também devem ser feitas algumas modificações, em "NÚMEROS DE COMENTÁRIOS" coloque quantos você quer que apareça. Em "TAMANHO" é o tamanho da caixinha de comentários, é o tamanho do post de comentário.


Para colocar moderação

Procure por: <head> 
 

Cole abaixo:

<meta content='ID DO APP' property='fb:app_id'/>   


Veja que novamente é pedido o código do ID APP, cole ali.
Salve as modificações e visualize.

Ele só será mostrado na página do post, e não na página inicial. 

Se não aparecer você terá que mudar um pouco o código, naquela parte de post-footer-line, podem haver vários dele, e variar de um template pra outro.
Tem o Line 1, 2, 3 ou mais. Aquele segundo código recorte-o de onde você colou e vá testando acima de cada post-footer-line, até dar certo.
Geralmente da certo no line 2, então comece por ele, se não der certo tente no 1, não deu certo teste no 3, até dar certo.

Eu sugiro criar um blog de teste, com o mesmo template do seu blog para tentar, quando der certo ai você já sabe como fazer no seu blog.

Fonte: Ellen Mota Tutoriais