segunda-feira, 21 de janeiro de 2013

Como colocar caixa de comentários do Facebook




Entãaaao... Vamos começar?
Eu vi percebendo em muitos blogs! que a caixinha de comentários
do facebook é muito comum e muito utilizada! e o facebook
esta muito popular, facilita o jeito de comentar de muita gente!
Então percebi que é muito preciso nos blogs de muitos blogueiros '
KKKKKKKKK; Então vamos começar!
Primeiro lugar você precisa criar o aplicativo! Clique aqui para ir
diretamente para o Site!, Em seguida vai abrir um box!
Lá em (Nome do Aplicativo) Você digita o que quiser
E em (Espaço do nome do aplicativo) você também
pode digitar o que quiser, contando que seja tudo junto...


Entedeu! Em seguida você clica em continuar e Pronto!
Seu aplicativo esta criado! Mais não para por ai!
Em seguida você precisa copiar o APP ID:
Que é o que mais vamos precisar!


Então! Agora iremos implantar no blogger!
Certo agora você vai no HTML do seu blog!
e clique em *Expandir modelo de widget
Então você aperta a tecla Crtl+F e procure
Pelo codigo: 

<body

Depois disso, cole este codigo abaixo dele:

<div id="fb-root"></div>

<script>

  window.fbAsyncInit = function() {

    FB.init({
      appId      : 'APPID', // App ID
      channelUrl : '//www.seudominio.com/channel.html', // 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>

Em seguida você substitua o "APP ID" Pelo o ID que você criou!
e Substitua  também o "seudominio.com"

Então... Proximo passo! você dá mais um Crtl+F, e procure pela Tag

<data:post.body/>

Caso não encontre,  procure por:

<div class=’post-footer-line post-footer-line-1‘/> 
Abaixo dela, 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='3' data-width='420' expr:href='data:post.url'/> </b:if>

Depois, Procure de novo por:

<head> 
Então, abaixo dele, cole:

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

Substitua o "APPID" pelo código de seu aplicativo criado.

Os comentários do Facebook já estão adicionados.


CUSTOMIZANDO WIDGET
  • data-width='420' : Largura do widget, vá ajustando para o melhor tamanho que se adequar a seu blog, vou pode ir diminuindo ou aumentando a largura alterando o '420' pelo tamanho em pixels que achar melhor.
  • data-colorscheme='light' : Como na maioria das template o fundo é branco, o código está customizado para esta cor, caso o seu contenha um fundo preto, mude para 'dark' pois poderá ficar melhor para seu template.
  • data-num-posts='3' : Número de comentários no widget, no código está '3', mude para a quantidade de seu agrado.

E não esquecendo de deixar os devidos comentários do Desenvolvendo Blogs!

E não esqueçam de comentar! Se fucionou! :D
Abraços ;D

0 comentários:

Postar um comentário

Facebook Google+ Twitter RSS