Comentários do Facebook no Blogger e Wordpress


O Facebook veio para ficar, quanto a isso não há dúvidas. Sabemos que as redes sociais tem um grande poder de visualização para blogs e sites, então vamos aprender a colocar os comentários do face no Blogger ou Wordpress.

 Faça sempre backup do seu template antes de modificá-lo , ou tenha um                               blog de testes, caso algo dê algo errado.



1 -  Criar um Aplicativo no Facebook

Clicar Aqui: Facebook Developers

Quando aparecer esta página, clicar em:

Meus Aplicativos => Adicionar um novo Aplicativo

*** Caso não tenha nenhum aplicativo, basta registrar-se e seguir as orientações é rápido e fácil




2 -  Logo após clicar em : Adicionar um novo Aplicativo, aparecerá essa página abaixo, clicar em Site.


3 -  Ao abrir a próxima página, no local indicado colocar o nome do seu aplicativo


4 - Clic em : Skip and Create APP ID


5 - Quando abrir a próxima página, preencha como se pede , clic em Crie um número de ID do Aplicativo


6 - Abrirá uma página com o número de ID, logo usaremos .



Agora vamos ao Blog.

Vá em Modelo => HTML => Crtl F => <head>










Abaixo de <head> colocar o código abaixo:



<meta content='SEU NOME FACEBOOK' property='fb:admins'/>
<meta content='ID DE SEU APLICATIVO' property='fb:app_id'/>


SEU NOME NO FACEBOOK - Colocar o nome de usuário que aparece no seu navegador.

ID DE SEU APLICATIVO - Número do appID 

Salve.

Agora Procure por </head>




Copie o código abaixo e cole-o acima de  </head>




<script type="text/javascript">
//<![CDATA[
$(window).bind("load resize", function(){
 var url = location.protocol+'//'+location.host+location.pathname;
  var containercm_width = $('#container-commentfb').width();
    $('#container-commentfb').html('<div class="fb-comments" ' +
    'data-href="'+url+'"' +
    ' width="' + containercm_width + '" data-num-posts="5"></div>');
    FB.XFBML.parse( );
  });
//]]>
</script>


Voce pode alterar o número de comentários que desejar, basta trocar o número "5", pela quantidade desejada.

Salve


Procure por:  div class='post-footer'



 abaixo desta tag colocar o código abaixo e salvar




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1'/>
<div id='container-commentfb' style='width: 100%;'><fb:comments expr:href='data:post.url' num_posts='5' width='650'/></div>
</b:if>


O  '650' é referente à largura da área dos comentários, aumente ou diminua de acordo com a àrea do seu blog.

Agora vc já pode ver os comentários do face no seu blog. Espero ter ajudado

Nenhum comentário:

Postar um comentário