Tutorial: Adicionar caixa de comentários do Facebook atualizada

Marcos Lora · 28/05/2013

Como verão, o Blogger mudou seu formato de editor... este é um tutorial que também ensinará como adicionar uma caixa de comentários substituindo a caixa do Blogger;

1.- Vamos em Modelo > Editar HTML > Marcamos Modelo de formato

2.- Buscamos a etiqueta <body> e logo após colamos o seguinte código:

HTML:

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

3.- Agora buscamos em nosso código a linha na qual apareça <div class='post-footer'> Pode ser que esta linha apareça duas vezes, se for assim, iremos à segunda aparição e logo após introduzimos o código:

HTML:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='currentUrll' style='display:none'><data:post.url/></div>
<br/><br/>
<script>
var urll=document.getElementById(&quot;currentUrll&quot;).innerHTML;
document.write(&quot;<div class='fb-comments' data-href='&quot;+urll+&quot;' data-num-posts='8' data-width='500'/>&quot;);
</script>
</b:if>

[FONT=Arial, Tahoma, Helvetica, FreeSans, sans-serif]4.- Salvamos nosso modelo e já teremos nossa caixa de comentários do Facebook para Blogger[/FONT]

[FONT=Arial, Tahoma, Helvetica, FreeSans, sans-serif]este é outro código para inserir este tipo de caixa, se esta opção não funcionar para você, pode tentar a partir deste outro tutorial: [/FONT]http://forobeta.com/tutoriales-de-blogger/158606-anadir-caja-de-comentarios-facebook-blogger.html

espero ter podido te ajudar nesta tarefa... um abraço e até o próximo tutorial 🙂

Carlos Arreola · 18/06/2013

Tutorial adicionado à lista, agradeço a contribuição.

isaacmartinez · 29/10/2013

Obrigado, recentemente implementei e funciona excelentemente bem 😱

Sayajin88 · 29/10/2013

Genial, funciona perfeito!

Don Gato · 29/10/2013

Obrigado pela contribuição :congrats:

jc7 · 30/10/2013

agradeço a contribuição

opaco · 30/10/2013

muito bom, obrigado pelo tutorial!

PerezHD · 30/10/2013

Obrigado<!🙂

dlrmarcos · 31/10/2013

Que coisa... não funcionou para mim u.upero igual, agradeço a contribuição 😉

mayjonathan · 31/10/2013

Ooo ótimo tutorial, muito obrigado.

Mugiwara · 16/11/2013

Muito obrigado, já fiz, mas agora aparece para comentar com o Facebook e com a conta do Blogger, como faço para remover a do Blogger e deixar apenas a do Facebook? Tenho outra pergunta, sempre aparece o Plug-in social do Facebook antes de comentar? Pode ser removido?

Bocmak · 18/11/2013

Também funcionou para mim este outro, genial🙂

penwen · 30/11/2013

muito bom, obrigado

pjvalencia12 · 02/12/2013

Que boa contribuição, obrigado

Marcos Lora · 02/12/2013

Mugiwara disse:
Muito obrigado, já fiz, mas agora aparece para comentar com o Facebook e com a conta do Blogger, como faço para remover a do Blogger e deixar apenas a do Facebook? Tenho outra pergunta, sempre aparece o Plug-in social do Facebook antes de comentar? Pode ser removido?

perdão pela demora em responder, busque este código:

HTML:

<div class='comment-form'>
    <a name='comment-form'/>
    <h2><data:postCommentMsg/></h2>
    <p><data:blogCommentMessage/></p>
    <data:blogTeamBlogMessage/>
    <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
    <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='240' id='comment-editor' name='comment-editor' src='' width='100%'/>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
    </script>
  </div>

e elimine-o, salve e pronto!

AnonimoX · 02/12/2013

excelente, faz tempo que buscava algo assim, valeu

scheval · 05/12/2013

Estava buscando algo assim. Obrigado

alejandro1507 · 29/12/2013

imarcos disse:

perdon que apenas te conteste, busca este codigo:

HTML:

<div class='comment-form'>
    <a name='comment-form'/>
    <h2><data:postCommentMsg/></h2>
    <p><data:blogCommentMessage/></p>
    <data:blogTeamBlogMessage/>
    <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
    <iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='240' id='comment-editor' name='comment-editor' src='' width='100%'/>
    <data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
    <script type='text/javascript'>
      BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
    </script>
  </div>

y eliminalo, guarda y listo!

Me esta pasando algo raro, ya que en mi plantilla no aparece <body>

solamente </body> alguna idea de como poder implementarlo?
Salu2

EnergyMech · 29/12/2013

Muito interessante a contribuição.

MitsuBelle · 02/02/2014

Muito obrigado :encouragement: funcionou maravilhosamente.

Tutorial: Adicionar caixa de comentários do Facebook atualizada

Marcos Lora

Carlos Arreola

isaacmartinez

Sayajin88

Don Gato

jc7

opaco

PerezHD

dlrmarcos

mayjonathan

Mugiwara

Bocmak

penwen

pjvalencia12

Marcos Lora

AnonimoX

scheval

alejandro1507

EnergyMech

MitsuBelle

Tópicos similares