Seu blog | Como adicionar a caixa de comentários do Facebook ao Blogger
sexta-feira, junho 12, 2015
Olá pessoal!
Hoje trago mais um tutorial da série Seu blog, voltada para os blogueiros que estão começando. É um passo a passo super útil e bem simples ensinando a adicionar a caixa de comentários do Facebook ao Blogger. Ela é uma ótima ferramenta pois facilita os comentários dos leitores, já que a maioria das pessoas está sempre conectada à esta rede social e pra comentar através dela no blog basta um clique. Então vamos ao tutorial.
1) Vá ao Painel do seu blog > Modelo > Editar HTML
2) Pressione Ctrl + F e pesquise por <body>
Caso não encontre, procure por:
<body expr:class='"loading" + data:blog.mobileClass'>
3) ABAIXO deste trecho, cole o seguinte código:
<div id="fb-root"></div>
<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>
4) Procure por:
</b:includable><b:includable id='status-message'>
5) ACIMA deste trecho, como no print abaixo, cole o seguinte código:
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<div id='comentariosFacebook'><div class='fb-comments' data-colorscheme='light' data-num-posts='5' data-width='500' expr:href='data:post.canonicalUrl'/></div>
</b:if>
E sua caixa de comentários do Facebook irá aparecer acima da caixa de comentários do Blogger em cada post. Caso deseje personalizá-la, siga os seguintes passos:
1) Procure por ]]></b:skin>
2) ACIMA do trecho encontrado, cole o seguinte código:
#comentariosFacebook {
background:#F2F2F2; /* Cor de fundo*/
width:520px; /* largura */
padding:10px;
margin-top:0px; /* Mude para -180px, se você colocou abaixo dos comentários do Blogger */
}
Depois é só alterar de acordo com o seu gosto e salvar.
Os códigos e o tutorial foram encontrados aqui.
Espero que tenham gostado, e qualquer dúvida é só perguntar nos comentários :)
Mari
ESSE POST FAZ PARTE DA SÉRIE "SEU BLOG". NESTA SÉRIE VOCÊ PODE CONFERIR DICAS VOLTADAS À BLOGOSFERA, PENSADA ESPECIALMENTE PARA VOCÊ, BLOGUEIRO. CONFIRA OUTROS POSTS!
4 comentários
Estou tentando e não consigo, não aparece no post. Só aparece o espaço em branco. Teria como me ajudar?
ResponderExcluirMe responda por aqui pois esqueci de ativar notificação ao outro comentário rsrs
ResponderExcluirSe tu seguiu todos os passos direitinho, infelizmente não sei o que pode ter acontecido :(
ExcluirMUITO OBRIGADA, seu tutorial foi o único que funcionou no meu blog. Por usar um template do ThemeXpose nunca conseguia um que funcionasse, muito obrigada mesmo.
ResponderExcluirA caixinha de comentários ficou abaixo dos comentários do blog, mas mesmo assim é um alivio.
Sua sessão de posts "Seu blog" ta me ajudando muito, já que estou começando nessa agora.
Parabéns pelo blog.
Link do meu blog caso queira dar uma olhadinha: http://luumusiando.blogspot.com.br/
Parabéns pelo blog novamente.
Beijos de luz!