dicas blog
Home » , , » Tutorial como adicionar comentários do facebook no blog passo a passo

Tutorial como adicionar comentários do facebook no blog passo a passo

0
Neste tutorial vou mostrar como colocar o sistema de comentários do Facebook no blogger, desta  forma 
com esse tutorial de comentários do facebook passo a passo você consegue facilitar na hora de se comunicar com seu público, aumentar  o  numero  de comentários nas  suas postagens, e deixar seu blog mais profissional.

Vou mostrar logo mais abaixo como colocar o sistema de comentários do  Facebook no blog em baixo  da caixa de comentários do blogger e em cima  da caixa de comentários do blogger.

Antes de tudo faça um (backup) do seu template, ou teste primeiro em um blog de testes!

Primeiro vamos criar  um ID para nossos comentários:



2 clique em my apps e depões em “registrar as a developer”:



3 mude a chave que esta em “não” para “sim”, para aceitar os termos de privacidade do  Facebook:


4 depões de aceitar  os termos,  vamos ser redirecionados a outra  pagina como na imagem  abaixo, passe o mouse em “my apps” e clique em  “add a new app”, logo em seguida clique em website:



5 clique no botão  “Skip and create app” ID que se encontra no canto da tela:


6 agora vamos  escolher  um  nome  para nosso aplicativo, para  que possamos identifica-lo, um nome de aplicativo sem  espaço, e uma categoria que  no  caso é aplicativo para  paginas e depões clique em criar aplicativo (Create app id):



7 pronto agora já podemos visualizar a ID do aplicativo, mantenha a pagina  aberta:



8 agora vamos ao painel do blogger, modelo e  editar HTML de um CTRL+F e procure pelo seguinte trecho no seu código <head> e logo abaixo  cole o código abaixo


<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='ID-DO-APLICATIVO' property='fb:admins'/>

Note no  código acima “ID DO APLICATIVO  neste local adicione a ID do aplicativo que você criou, os números e salve:

9 agora de um CTRL+F e procure pelo seguinte trecho <b:includable id='comments' var='post'> e logo abaixo dele cole o código abaixo, para que os comentários do Facebook apareçam acima dos comentários do blogger.

<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='5' width='620'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'/>

Para que os comentários do Facebook apareça abaixo dos comentários do  blogger, procure  pelo  seguinte trecho

<b:if cond='data:showCmtPopup'>
      <div id='comment-popup'>

E logo acima delas adicione o código que citei acima:

Preste  muita atenção  agora, caso você  já tenha botões de compartilhamento do  Facebook em seu  blog, ou uma fan page, não cera  necessário usarmos  o código  abaixo, caso não tenha nado  do Facebook em  seu  blog, adicione o código abaixo  dentro  de um gadget no seu blog e salve:

<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/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Para determinar  a largura dos comentários altere o  trecho width='620' pela largura da sua  pagina:

Para controlar o numero de comentários altere a seguinte trecho  num_posts='5' o numero  5 significa o  numero  de comentários.


Depões disso  salve  e visualize seus comentários, qualquer  problema  ou  divida, entre em contato por comentário, que dou o suporte necessário.

0 comentários:

Postar um comentário