Criando um aplicativoPara utilizar do sistema de comentários do facebook é necessário a criação de um aplicativo, você vai saber o porque no decorrer do tutorial.
1. Crie um App ( Aplicativo ) no Facebook, para isso acesse esse link:
https://developers.facebook.com/apps2. Agora na página Aplicativos clique em "+ Criar Novo Aplicativo" um botão no canto superior direito da página.
3. Vai abrir um box e nele coloque o nome do aplicativo, você pode colocar o nome de seu blog ou que quizer em 'App Name' e em 'Espaço de mome do aplicativo' coloque uma palavra qualquer que deseje ( sem espaços ) Depois clique em "Continuar"
4. Pronto seu aplicativo foi criado. Você pode o configurar, personalizar, isso é com você, neste tutorial iremos precisar somente do código 'App ID' de seu aplicatvo.
Não feche a página pois o código App ID é necessário.
Colocando sistema de comentários do facebook no blogger
1. Acesse o painel de seu blog.
2. Clique na guia "Modelo" e depois em "Editar HTML"
3. Marque a opção "Expandir modelos de widgets"
4. Procure por: ( Ctrl + F )
<body
5. ABAIXO da linha encontrada cole.
<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>
Substitua o "APPID" pelo código de seu aplicativo criado.
Substitua também "www.seudominio.com" pelo domínio de seu blog. EX: www.melhortutorialdomundo.blogspot.com.br
6. Localize a tag abaixo: ( Ctrl + F )
div class='post-footer-line post-footer-line-3
7. Abaixo dela, cole:
<b:if cond='data:blog.pageType == "item"'>
<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 = "//connect.facebook.net/pt_BR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class='fb-comments' data-colorscheme='light' data-num-posts='3' data-width='420' expr:href='data:post.url'/> </b:if>
9. Agora porcure por:<head>
10. Abaixo da tag acima, cole o seguinte código: ( Necessário para moderação dos comentários )<meta property='fb:app_id' content='ID APP' />
Substitua o "APPID" pelo código de seu aplicativo criado.CUSTOMIZANDO WIDGET
- data-width='420' : Largura do widget, vá ajustando para o melhor tamanh
- o 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.
11. Agora Salve o Modelo.
Os comentários do Facebook já estão adicionados.
Moderação de Comentários
Existe uma página para visualização e moderação dos comentários, clique
Ocultando comentários do Blogger
Nas postagens irão aparecer os comentários do Facebook
e do Blogger
, para não ficar com os dois é necessário que você oculte os
comentários do Blogger.
Acesse as Configurações > Postagens e comentários >
Em Comentários,local do comentário clique no menu de opções e clique em "Ocultar".
Deixei seu comentario e ajuda o blogger curtindo e se escrevendo em nosso canal
