Como instalar Comentários do Facebook no blog

Usar o plug-in dos comentários do Facebook permite que haja mais interação com os leitores, fazendo com que se sintam mais motivados a comentar, já que a ferramenta é bem simples e usa apenas o próprio perfil do Facebook. Se você quer fornecer essa opção além do sistema de comentários da sua plataforma, vamos ao tutorial:

1º passo: Acesse este site do Facebook, onde você pode gerenciar todos os aplicativos desenvolvidos pela sua conta do Face.

2º passo: Clique em Cadastrar-se agora. Irá aparecer uma janela de confirmação, confirme e clique em Crie um número de identificação do aplicativo.

3º passo: Identifique o aplicativo com o nome do seu blog e confirme seu endereço de e-mail:

4º passo: Confirmada a criação do número de identificação do aparelho, aparecerá um painel com o CÓDIGO ID DO APLICATIVO que precisamos. Localize-o e copie o código, pois vamos precisar dele.

5º passo: Acesse o Painel de visualização dos comentários. É aqui que você terá acesso a todos os comentários, saberá em quais posts foram feitos cada um, além de excluir e banir comentários indesejados. Para receber notificações no seu próprio Facebook pessoal de novos comentários, vá em Configurações > Moderadores e no campo que aparece digite seu nome de usuário/perfil pessoal e salve:

6º passo: Agora chegou a vez de inserir os comentários no HTML do seu blog. Vá no seu editor HTML e logo após a tag <head> insira os seguintes códigos:

Substitua seufacebook pelo seu user no Facebook. Para saber qual é o seu, acesse seu perfil pelo computador e copie o que aparece logo após de "https://www.facebook.com/", exemplo: "https://www.facebook.com/funaladetal015", seu user do Facebook é fulanadetal015.

Substitua iddoaplicativo pelo código que você copiou no 4º passo.

7º passo: Vamos inserir a "caixinha" dos comentários na divisória certa, que pode variar de acordo com seu template e seu layout. Esteja ciente de que sempre é logo acima ou logo abaixo dos comentários do próprio Blogger/Wordpress, então em caso de dúvidas sempre procure por essas divisórias no seu código.

Tecle CTRL + F e procure pela divisória <div class='post-footer-line post-footer-line-3'>.

Caso não encontre, vamos usar outra divisória, então procure por uma dessas seguintes:

<b:includable id='comment_picker' var='post'>

<b:includable id='threaded_comments' var='post'>

Não necessariamente a divisória do seu template vai ser uma das citadas acima. Você precisa ter conhecimento do seu template e adicionar o código na sessão de comentários das postagens. Se você não conhece o HTML do seu template, peça ajuda ao idealizador do mesmo.

8º passo: Encontrada a divisória, logo abaixo dela iremos inserir o seguinte código (créditos ao blog FalaDantas):

<b:if cond='data:blog.pageType == "item"'>

<h4>

<fb:comments-count expr:href='data:post.url'/>

comentário(s) pelo facebook:

</h4>

<fb:comments expr:href='data:post.url' num_posts='5' publish_feed='true' width='680'/>

</div>

</b:if>

Salve as alterações e acesse um post do seu blog que já tenha comentários da sua plataforma original para ver se funcionou.

ATENÇÃO:

1. Apague o código em vermelho apenas se quiser que os comentários apareçam na página inicial do seu blog e não apenas quando se abre o link do post. Muitos blogueiros preferem manter esse código.

2. Mude o número 5 pelo número de comentários que serão exibidos antes do botão "Carregar mais comentários".

3. Mude o número 680 para mais ou para menos, ajustando, assim, a largura da caixa dos comentários para ser a mesma que a dos comentários do seu layout.

4. Se você usa um template responsivo gratuito do Themexpose ou semelhante, no seu Editor HTML tecle CTRL + F, busque <div class='post-comments' id='coments'> e insira o código do 8º passo logo após o fechamento </div>, como mostra a imagem seguinte: