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 Facebook. Clique 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:
- -Abra o Blogger, entre em Modelo > Editar HTML e aperte Ctrl+F
- -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:
- 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 == "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='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.
adorei o tuto!bj
ResponderExcluirhttp://distractionsofaagirl-oficial.blogspot.com/
Oi Marianne
ResponderExcluirEu 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
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!
ExcluirQue bom que você gostou do passo a passo!
Amooo tutoriais pra blog, é meu assunto preferido dps de make claro!! Beijão, Carol do blog Red Lipstick
ResponderExcluirSomos duas então!
ExcluirÉ sempre muito útil esse tipo de post né?
Adorei a dica. Vou fazer no meu blog.
ResponderExcluirTudo o que acho é complicado. Mas achei o seu facinho.
Beijos
http://rodrigobandasoficial.blogspot.com.br/
Fico feliz em saber que você gostou!
ExcluirAntes de eu começar a mexer com html todos tutoriais que encontra eu achava difícil também.
Oii,
ResponderExcluirEstou salvando aqui e vou tentar fazer. Adorei a forma como você explicou!!!
Obrigada <3
Beijinhos,
EC&M
Tenta sim, se precisar de ajuda estou a disposição.
ExcluirTentei explicar do jeito mais simples possível haha
Amei o tutorial!
ResponderExcluirBeijos
featglam.blogspot.com
Fico feliz em saber que você gostou.
ExcluirAmei o post bem explicadinho!!
ResponderExcluirhttp://oficialgarotateen.blogspot.com.br/
Que bacana.. vai ajudar muita gente :)
ResponderExcluirwww.chadecalmila.com
Assim espero!
ExcluirAmei o tutorial flor, parabéns
ResponderExcluirBeijos
http://segredosdacahlima.blogspot.com.br/
Fico feliz em saber que você gostou!
ExcluirObrigada
Eu tenho e adoro os comenarios via facbook... Mas as vezes o app da uns bugs... mas vale a pena!
ResponderExcluirbeijos
www.salada-frutas.com.br
Eu também gosto bastante,aqui nunca deu nenhum bug acredita?
ExcluirOi Marianne olha eu aqui de novo.
ResponderExcluirTem uma surpresa pra você no meu blog.
Ficou curiosa rsrsr? Corre lá e confere.
Bjos A Moda In Foco
Eba, adoro surpresas hahaha
ExcluirVou agora mesmo conferir.
Ola Linda, post super útil para as blogueiras de plantão! Hahaha
ResponderExcluirAdoro esse tipo de dica :)
Um beijão e até a próxima
www.garotaurbana.com.br
Fico feliz em saber que você gostou !
Excluirgente \o/ eu estava atrás desse tutorial a muito tempo ! muito útil !
ResponderExcluiradoro tutoriais :) perfeita essa dica
bjs
http://rainhasdasdicas.blogspot.com.br/
Sério?? Que bom!
ExcluirFico feliz em poder te ajudar...
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!
ResponderExcluirVocê simplificou o que muita gente complica. Parabéns flor!
ResponderExcluirAdorei o tutorial... queria muito instalar no meu, pena que no wordpress não dá :/
ResponderExcluirBjs
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?
ResponderExcluirAdorei o post, muito bom. Pena que sou burrinha neste assunto rsrs sempre gostei disso.
ResponderExcluirhttp://capricheinlife.blogspot.com/