Por que usar comentários do facebok em meus artigos é vantajoso?
Temos duas respostas: A primeira é que, quando uma pessoa comenta um artigo, além de ser mostrado no blog será mostrado na linha do tempo de quem comentou, assim seu link estará sendo divulgado para mais pessoas. O segundo ponto é que, em termos SEO, quanto mais divulgação nas redes sociais seu blog obtiver, mais relevante será seu blog nas pesquisas.
Pois bem, após esta pequena explicação vamos ao que realmente interessa neste tutorial.
1. Crie um Aplicativo: Para isto clique AQUI
2. Na página aplicativos clique em
3. Após clicar no botão, irá abrir um box, onde você colocará o nome do seu aplicativo, no mome de espaço você pode repetir o mesmo nome com acrescimo de alguma letra. Escolha a categoria e clique em criar aplicativo.
4 Pronto seu aplicativo foi criado, agora você poderá configurar, personalizar seu app, mais neste turorial você só irar precisar do "App ID".
Voltando para o blog acesse Painel do seu blog > Modelo > Editar HTML
Dê Ctrl+F e pesquise <body
Clique em expandir modelos widgets
Abaixo da linha cole o código abaixo:
Onde está escrito em detalhe vermelho troque pelo numero do seu "APP ID" que foi criado, e adicione a url do seu blog.<div id="fb-root"></div><script>window.fbAsyncInit = function() {FB.init({appId : 'APPID', // App IDchannelUrl : '//www.seudominio.com/channel.html', // Channel Filestatus : true, // check login statuscookie : true, // enable cookies to allow the server to access the sessionxfbml : 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>
Agora pesquise (ctrl+f):
<data:post.body/>
ou
<div class=’post-footer-line post-footer-line-1‘/>
Abaixo copie o código:
<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>
Feito isso procure pela tag : <head>
E abaixo dessa tag copie este código:
<meta property='fb:app_id' content='ID APP' />
(Que é necessário para moderar os comentários)
Substitua "ID APP" pelo numero de seu aplicativo.
Para mudar dimensões ou altera a quantidade de comentários que será mostrado, segue abaixo os detalhes:
data-width='420' : Largura do widget, vá ajustando para o melhor tamanho 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.
Para fazer alterações bastar procurar o trecho acima para você editar, se caso for preciso.
Postar um comentário