Como usar os sistemas de comentários do Blogger e Facebook ao mesmo tempo

Blogger, Comentários, Facebook
185
Siga o Ferramentas Blog: Canal no Youtube | Facebook | Twitter | Google+
Acesse AGORA: https://blogueiro.pro e se torne um Blogueiro de Elite.

O sistema de comentários do Blogger sozinho não atende tanto às nossas necessidades de usuários, por isso integramos outros serviços. Agora vou mostrar como usar dois ao mesmo tempo, mantendo o modelo padrão do Blogger e adicionando o do Facebook, sem conflito e ocupando pouco espaço. O visitante é quem escolhe o que quer ver e usar.

Vou pode ver o modelo da imagem abaixo funcionando aqui e testar para ver o resultado: Ver modelo de testes do comentário integrado.

formulario-comentario-facebook-blogger

✅ Canal no Youtube | Inscreva-se AGORA ✅

Na imagem acima você já pode ver que os dois formulários de comentário compartilham o mesmo espaço e basta selecionar a aba desejada para comentar como quiser.

formulario-comentario-blogger-facebook

Pode parecer complicado de usar assim em seu blog, mas posso garantir que é um tutorial rápido e fácil para instalar e começar a usar nesse formato em seu blog.

Já ensinei aqui como usar só o formulário do Facebook. A grande vantagem é que ajuda a divulgar seu blog de forma bem eficiente.

A diferença agora é que vou mostrar como manter os dois modelos e dar escolha para o seu visitante, especialmente para quem não tem Facebook e quer usar o modelo padrão do Blogger ou o contrário.

Como instalar o sistema de abas para os comentários

Vamos direto ao tutorial. Mas antes, primeira coisa é tentar tudo o que será mostrado em seu blog de testes, verificar os resultados e só depois aplicar em seu blog principal. Também sem esquecer de fazer backup de tudo, mesmo depois de ter certeza.

Passo 1.

Vá ao painel do Blogger, clique no menu “Design” ~> “Editar HTML” e marque a opção “Expandir modelos de widgets” para ver todo o código fonte do seu blog, como ilustra a imagem abaixo:

Agora, nessa tela, procure pela seguinte linha de código:

<div class='comments' id='comments'>

É esta linha que indica o local do formulário padrão de comentários do Blogger e será nossa guia nesse processo.

Passo 2.

Imediatamente ABAIXO dessa linha que encontramos, vamos colar o trecho de código exatamente como mostrado abaixo e sem mudar nada além do que for indicado:

<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' title='Comentários no Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comentários
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&quot;#blogger-comments&quot;);' title='Comentários no Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comentários
</div><div class='clear'/>
</div>
<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='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>

O número marcado de vermelho no código determina a largura do formulário de comentários do Facebook. Só altere esse número se você souber a medida do espaço que tem para os formulários.

Ainda não acabou e falta só mais uns detalhes.

Passo 3.

Nessa mesma tela dentro do código fonte de seu blog, procure agora pela linha que diz:

<head>

E logo ABAIXO dela, cole o seguinte trecho, cole um pequeno Script que fará tudo funcionar:

<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='YOUR_FB_ID' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>

Agora salve o modelo, clicando no botão laranja “SALVA MODELO”. Mas ainda faltam os estilos em CSS para que tudo funcione e apareça o resultado em seu blog.

Passo 4.

A última coisa é colar o CSS que forma o estilo e organiza os formulários.. Depois de salvar os passos citados acima, clique na aba “Design” ~> “Designer do modelo”. Na janela que abrir procure no menu lateral pela opção “Avançado” e ache o “Adicionar CSS”.

designer-modelo-avancado-CSS-blogger

No espaço indicado, cole o seguinte trecho de CSS:

.comments-page {  background-color: #f2f2f2;}
#blogger-comments-page {  padding: 0px 5px;  display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px;  width: auto;  margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}

Depois clique no botão laranja “Aplicar a Blog” para salvar essa alteração e depois volte para o Blogger.

Pronto. Agora já está funcionando o seu novo modelo de formulário de comentários, integrando Blogger e Facebook ao mesmo tempo.

Observações: Para funcionar perfeitamente, recomendo que escolha a opção de moderar comentários do Blogger e retire a verificação de palavras.
Não é possível, segundo esse modelo, moderar os comentários feitos no Facebook.

Outros artigos e tutoriais sobre comentários:

Fonte: Tutorial FB Comment Box

.

185 Comentários

  1. Marcos,

    Fiz no meu blog de teste e deu tudo certinho. Só que apareceu um espaço em branco antes do primeiro comentário do blogger.

    Abs!

    Responder

  5. Já tinha feito isso num blog de testes e não gostei do resultado. Não combinou com o lay-out atual do meu blog. De qualquer maneira é uma opção a ser pensada.
    Eu também até testei os comentários do Google Friend Connect. O resultado final também não me agradou.

    Responder

  9. Marcos parabens pela materia, fiz o teste, coloquei um uns dos meus blog´s ficou otimo essa sessao de comentario pelo facebook, parabens amigo , fico agradecimento pela suas dicas, pois sou um assinante do rss, e recebo todas suas atualização, grato por tudo …… abraços VLw.

    Responder

  10. Olá…
    Tenho uma dúvida. Coloquei no meu blog e funcionou perfeitinho, mas será que eu poderia trocar a ordem das abas? Tipo deixar aparecendo os comentários do blog e não do facebook?
    Outra coisa: tenho aquele botão de compartilhar do FB (e do Twitter), usar esse método dos comentários, vc acha que invalida o uso desse botão compartilhar? É a mesma coisa?

    Aguardo, já agradeço e te parabenizo pelo seu blog… que é excelente!

    Responder

    • Tatiana,
      É possível trocar, mas teria que testar para descobrir como fazer. Não tentei isso ainda.

      Sobre os botões, acho válido usar mesmo com o sistema de comenta’rios.

      Responder

      • Acabei de colocar no meu, gostei muito, afinal o facebook é responsável por muito dos meus acessos e comentários, mas eu também gostaria de ter essa inversão: /comentários Blogger/ comentários Facebook/, agradeço se resolver isso pra gente!!!

        O blog está excelente!Já está nos meus favoritos!

        Responder

      • É simples

        Ao instalar o IntenseDebate ou qualquer outro sistema/formulário de comentário não instale no Template e sim como widget depois que instalar faça exatamente como está neste tutorial!
        SIMPLES!!!

        Eu estou usando o Disqus e o Facebook

        Obrigado Marcos!

        Responder

      • Amigo tem um tutorial não de como faz para criar o APP no FACEBOOK, por que os tutoriall que tem ta desatualizados e não funciona mais, já tentei de todas as formas aqui e acho que não deu ?

        Responder

    • Bacana isso. Eu localizei o YOU_FB_ID mas agora não sei onde devo colocar minha ID.
      E o que é Domínio? Onde eu arrumo isso para me colocar como Administrador direto na página?

      Obrigado.

      Responder

  18. Hã… de novo.
    Alguém sabe me dizer qual a propriedade que troca a cor dos coments do facebook?
    Já li tudo e testei de tudo sem sucesso.
    Grato!

    Responder

    • Caso ainda não solucionou seu problema
      Edite o cod. CSS que é indicado no final do tutorial!
      Ali vc edita todo o formulário de comentários!
      Espero ter ajudado
      Abraço!

      Obs: Segui a Dica Num Comentário Mais Abaixo Publicado Pelo Responsável Pelo Tutorial e Estou 100% Satisfeito!

      Responder

  19. No meu blog deu tudo certinho, mas apareceu a aba Face acima da aba Blog… como faço pra aparecer como no seu (formulários um ao lado do outro)????
    Obrigada!

    Obs: A aba Blogger ficou o dobro do tamanho da aba Face.
    Como faço pra ficarem do mesmo tamanho como no seu????

    Responder

  21. Olá… eu de novo! rs..
    O comentario do FB e Blogger aparecendo no blog tá perfeito, mas percebi que os comentários não aparecem no facebook: nem no meu mural, nem no mural de quem comentou. É assim mesmo?
    No codigo do seu tutorial, onde tinha ‘fb:appid’ eu coloquei ‘fb:o numero do id da app do meu blog no facebook’. Não alterei o ‘fb:admin’
    Preciso fazer mais alguma coisa ou os comentarios feitos no blog nao aparecem mesmo em lugar nenhum no facebook?
    Outro detalhe: só usei o código desse post aqui, nao usei o código do post onde vc ensinou a colocar só o comentario do fB no lugar do comentario do blogger. (até tentei mas nao funcionou os 2 códigos juntos).
    Help, please.

    Responder

  22. Marcos

    Parabéns pelo blog. Vivo alterando a cara da minha página graças à suas dicas….risos

    Uma dúvida: eu consigo postar comentário com o perfil da minha página no facebook ou somente com o perfil do meu usuário?

    Obrigada

    Responder

  23. Muito bom e está rodando direitinho no meu blog.
    Mas tenho duas perguntas:

    1) Nos meus comentários ali em cima sempre fica 0 comentários pq ele só conta o número de comentários do blogger e não do facebook. Teria um modo de reverter isto ou tirar aquele número dali?

    2) Teria uma maneira de eu receber um aviso ou por e-mail cada comentário que dêssem no meu blog pelo facebook?

    Se alguém puder me ajudar, por favor! *-*

    E parabéns Marcos, teu blog é um exemplo 😀

    Responder

  24. Ótimo post! Deu certinho.

    Mas tem um detalhe que o deixaria mais completo: quando o blog é de cor escura, as fontes são claras tanto no blog quanto nos comentários e, assim, ficam ilegíveis sobre o fundo que se torna da mesma cor do fundo do facebook, que, por sua vez precisa de fontes escuras para ser legível.

    Eu sugeriria adicionar a este tutorial informações de como usar a aparência “dark” do facebook para que possa ser usado este sistema de comentários concomitantes em blogs de fundos escuros.

    Tenho uma pergunta: existem outros serviços de comentários simultâneos como por exemplo com o twitter?

    Parabéns pelo trabalho e obrigado.

    Responder

  26. Agora deu certo…
    No “Posição do formulário de comentários” estava como: página inteira, quando mudei para “postagem abaixo incorporada” funcionou.

    Responder

  27. Parabens!!! Coloquei no meu Blog [link suprimido] e ficou perfeito… Otima dica… Melhor explicado impossivel… Quem tiver em duvida pode usar funciona perfeitamente… Valeu!!!

    Responder

  29. Olá Marcos. Eu fiz td direitinho, mas quando fui acessar uma página do meu blog para ver o resultado, percebi que na parte onde a pessoal comenta usando o Facebook não está funcionando. Aparece somente essa menssagem: The comments plugin requires an href parameter.

    Responder

  30. Deu tudo certo, ficou muito bom, mas o fundo do meu blog é preto e quando eu instalo no meu blog fica branco e não dá pra ler nada, eu também gostaria de saber como trocar a cor de fundo para preto, dá uma força aí. Desde já agradeço

    Responder

  32. Opa, fiz e refiz umas 10 vezes. Funciona o Facebook, mas o blogger não. Não aparece o campo para colocar o comentário. O que será que pode ser?

    Vejam, no meu blog deixei no corpo do post o Facebook (que já estava antes) e ai respeitando o tutorial coloquei o facebook com o blogger mais no final. Mas ao clicar no blogger, os campos não abrem. Não consigo descobrir onde errei.

    Se alguém puder olhar e me dar uma idéia do que fiz errado, ajuda.
    Vlw, abs.

    http://www.delphitodelphi.blogspot.com

    Responder

  33. Eu tinha mandado esse recado mas ainda não recebi uma resposta. Deu tudo certo, ficou muito bom, mas o fundo do meu blog é preto e quando eu instalo no meu blog fica branco e não dá pra ler nada, pelo visto algumas pessoas aí também tão querendo uma ajuda em relação a isso de saber como trocar a cor de fundo para preto, dá uma força aí. Desde já agradeço

    Responder

    • Todas as cores e configurações desse tipo de detalhe pode ser mudada no código CSS (o ultimo trecho de códigos desse tutorial).
      Assim você pode mudar as opçòes de cores e até de fontes.

      Responder

  34. Eu consegui mudar o fundo para o preto, mas quando vai comentar pelo facebook as letras do comentário ficam pretas e não dá pra ver nada, do lado do blogger fica branca normamelmente, como eu posso mudar a cor da letra do comentário do Facebook para branco? Agradeço desde já

    Responder

  35. Eu instalei no meu blog esse método de comentar pelo facebook e pelo blog, e depois eu instalei o visualizador de fotos lightbox que você fez neste tutorial (https://ferramentasblog.com/2010/03/efeito-lightbox-para-imagens-no-blog.html) só que quando eu instalei o lightbox, o método de comentar pelo facebook e pelo blog não funciona, quando clica na aba de comentar pelo blog ela não abre, você sabe o que pode estar acontecendo? Se puder ajudar ficarei agradecida, agredeço desde já.

    Responder

    • Isso deve ser algum conflito.
      Não dá pra determinar exatamente o que pode ter acontecido. Por isso que sempre sugerimos testes antes de se aplicar mudanças no blog principal.
      Nesse caso, acho que você terá de escolher qual recurso prefere usar em seu blog para eliminar o conflito.

      Responder

  36. Ah sim entendi, o estranho é que quando o lightbox está instalado o sistema de comentar pelo facebook e blog fica instalado normalmente e dá até pra comentar pelo facebook, só a aba do lado do blog que não abre.Agradeço pelas ajudas, tem me ajudado bastante.

    Responder

  38. Olá eu amo este site tem me ajudado muito. Hoje o meu blog é o que é graças ao Ferramentas Blog.
    Obrigada a todos…..com certeza vou continuar a participar. Força

    Responder

  40. Muito bom o codigo, só precisei efetuar algumas adaptações em relação a pagina inicial para mostrar quantos comentarios já foram publicados em ambas as opções facebook ou blogspot.

    Obrigado!

    Responder

  41. Já consegui inserir os comentários FB/Blggr em uns 4 blogs com sucesso mas não consegui fazer com que funcionasse com perfeição em apenas um blog e isso está me intrigando rpa caramba…
    O blog é esse que está no meu link aqui no comentário e tudo é inserido de maneira correta no HTML. O CSS tbm é inserido correto e acontece um único problema: não consigo abrir a aba dos comentários do Blogger. Ela está lá, clicável mas, ao clicar, nada acontece.

    Alguma solução, pleaaase? :~

    Responder

      • Tens alguma ideia do que seria especificamente? Sei lá… :/
        Sou um tanto leigo em html e adjacências e cutuquei o máximo que sei e não achei nada de errado…
        Alguma ideia ou sugestão de onde eu poderia tentar citicar para tentar resolver?

        Responder

        • Acabei desistindo…Coloquei o sistema do Disqus que também tem a opção de Facebook e corri pro abraço. 😛 Valeu pela resposta, Marcos! Parabéns pelo trabalho no blog que é show!

          Responder

  43. Cara, parabéns!
    Funcionou perfeito aqui no blog que estou fazendo. E olha que eu não sei “nadica” de programação, o que eu faço no Blog é de pura curiosidade! Sucesso e até a próxima dica. Valeu.

    Responder

  47. “Viviani disse:

    No meu blog deu tudo certinho, mas apareceu a aba Face acima da aba Blog… como faço pra aparecer como no seu (formulários um ao lado do outro)????
    Obrigada!

    Obs: A aba Blogger ficou o dobro do tamanho da aba Face.
    Como faço pra ficarem do mesmo tamanho como no seu????”

    O meu problema foi o mesmo da Viviane, encontrou alguma solução pra isso? Gostei muito dessa opção, mas ficou da mesma forma qeu ela descreveu. Se puder me dar uma dica, grato desde já.

    Responder

  49. Bom, eu gostaria de saber uma coisa =P por exemplo, se há 5 comentários no facebook e 3 no blogger, se vai mostrar: “8 comentários” to querendo muito colocar isso no salvo sim! so resta essa dúvida… :'( poderia me ajudar nisso? :DDDDD

    Responder

  50. VISH… não apareceu o HTML que deixei ae =P auahuaha msm assim, quando eu descobrir eu vou entrar em contato por email

    (detalhe, quando conta os comentários do facebook, eles demora um pouquinho pra aparecer escrito, por exemplo: “2 comentários”, mostra apenas “comentários” +/- 1 minutos depois aparece contando :D) abraço!

    Responder

  52. Fiz o procedimento ao pé da letra, porem no MEU blog nao funciono a aparecia das abas, mas esta alternando entre um e outro.

    Alguma dica?

    Parabens pelo blog!

    Responder

  55. Essa dica foi uma das melhores, até porque, quando alguém comenta com o sistema do facebook, publica no perfil dessa pessoa. Eu tenho um pedido a fazer, será que você não conseguiria fazer um sistema igual esse, só que integrando o sistema de comentários do gravatar também meu caro Marcos?

    Responder

  58. Que maravilha! Eu queria muito usar a caixa de comentários do Facebook, mas não queria abandonar a do blogger. Nem imaginava que tinha um jeito de deixar as duas e de aplicação tão fácil. Muito obrigado por partilhar a informação.

    Abraços.

    Responder

  59. Pois é, me ocorreu uma coisa aqui agora e por coincidência ví que vc publicou um vídeo que fala sobre a moderação de comentários. Eu gosto de moderar os comentários para saber o que está sendo publicado, como está a aceitação do meu blog e principalmente para não ser responsabilizado por coisas que os outros dizem. Sendo assim, esse sistema de comentários do facebook que vc demonstra nesse post não possui nenhum sistema para controlar, moderar e apagar comentários impróprios?

    Aguardo sua resposta, abraços mais uma vez.

    Responder

  60. Que pena! Fui testar agora e não está funcionando direito. Publico um comentário parece que está tudo certo, mas quando abre em outro navegador não há comentário algum. Não queria, mas vou ter que retirar e ficar só com o do blogger mesmo. 🙁

    Responder

  61. Ah sim, no blog toxinadiaria.com aparece a contagem dos comentários do facebook, acho que é porque ele marcou a opção lá em “design”, de novos posts não terem comentários… D: e ele disse que pegou daqui, então, deve ser isso mesmo…

    Responder

  65. Ficou bacana no blog, já uso a alguns meses, mas um problema que não consigo solucionar, gostaria de ser informado quando alguém comenta, pois ao contrário do outro tutorial, esse não fornece nenhum feedback para o admin do blog.

    Responder

  66. Pessoal, existe alguma maneira de moderar esses comentários? Não encontrei nenhuma maneira até agora, se alguém poder me dar uma ajuda ficarei muito grato!

    Obrigado!

    Responder

  69. Como arrumar a contagem dos comentários?
    Aqui não está aparecendo o contador dos comentários no Facebook, não sei se caso aparecesse somaria com os do Blogger para a contagem que aparece na página inicial… Gostaria muito de organizar a contagem, pelo menos.

    Responder

  70. Pessoal saquei mais ou menos como moderar e visualizar os comentários em um só lugar

    Primeiro de tudo é preciso criar uma fanpage e um app de sua página no facebook (aqui no ferramentasblog ensina a fazer)

    Depois disso você deve inserir as tags com os respectivos App_ID e Admin_id (no mesmo lugar indicado no post acima)

    Para ver todos os comentários feitos por usuários do facebook e moderá-los você deve acessar essa página:
    http://developers.facebook.com/tools/comments/

    É claro que tem como integrar melhor os comentários no blog com o app da sua página no face, mas ainda não aprendi.. 😛

    Responder

    • Onde você esta vendo a App_ID no código à cima? só encontro a Admin_id…
      Tem como adicionar uma meta ID nesse código?

      Responder

  72. Pessoal consegui resolver facilmente como moderar comentários e saber de qual post eles são.. tudo muito simples bem bacana..

    Tentei postar a dica aqui, mas as tags html não aparecem, portanto quem quiser saber como ativar o recurso da moderação no blogger, acessem meu blog e me enviem um email.

    Abraço a todos!

    Responder

  75. Com esse novo sistema do blogger (Threaded Commenting) como faço para retirar esse sistema de abas(ja que não esta funcionando)?
    É so retirar esse código que foi adicionado?

    Responder

  77. Boa tarde!
    Eu fiz aqui e deu tudo certo.
    Porém… quando publico uma nova postagem, as abas não aparecem, só aparece a caixa padrão de postagem de blog.
    Depois de comentar no blog é que aparecem as abas.
    Alguém teve esse problema? Sabem o que poderia ser feito para resolver?
    Obrigada pela ajuda!

    Responder

  78. Adotei este sistema e estou muito satisfeito.

    MAS…

    Existe algum tipo de mecanismo que me avise quando alguém faz um comentário? Tem bastante gente postando comentários no blog mas eu não respondo porque não vi que escreveram nos posts mais antigos.

    Responder

  79. Obrigado pelo post, fiz o passo a passo no meu blog de teste e na primeira tentativa não tinha funcionado porque no meu template tem duas linhas e eu tinha colocado abaixo da primeira linha, colocando na segunda linha aí sim funcionou normalmente, também testei em outros navegadores, tudo normal, daí joguei para o meu blog principal e ficou perfeito. Acredito que agora com esta integração com o Facebook, conseguirei um número maior de comentários que o sistema do Blogger é bem limitado.
    Abraços e mais uma vez obrigado por este blog excelente que me ajuda muito.

    Responder

  80. Oi Marcos! Adorei o tutorial, foi bem fácil de fazer.
    Integrei os comentários do face com o do blogger, mas o link para comentar com o face só aparece se já tiver um comentário do blogger na postagem. Sabe dizer por que?

    Responder

  81. Olá!
    Primeiramente, gostaria de salientar o quanto o seu blog tem sido útil nas modificações que tenho implementado no meu. Os tutoriais são todos bem explicados, o que facilita (e muito) quem não entende muito de programação.

    Mas então, vamos ao meu problema.
    Segui esse tutorial e, no fim do processo, realmente as duas opções de comentário estavam disponíveis. Entretanto, não como mostrado nas imagens, lado a lado em abas, mas sim uma embaixo da outra, sem marcação em abas.

    Será algum problema com a largura? Tentei aumentar a largura da página mas o problema persistiu.

    Poderia me ajudar?

    Att,

    Responder

      • Refaça o passo 4 assim com o codigo CSS desse jeito: ]]>.comments-page { background-color: #f2f2f2;}
        #blogger-comments-page { padding: 0px 5px; display: none;}
        .comments-tab { float: left; padding: 14px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
        .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
        .comments-tab:hover { background-color: #eeeeee;}
        .inactive-select-tab { background-color: #d1d1d1;}

        Responder

  82. O seguinte trecho de código também poderia ser colocado antes de ]]>, pois é a folha de estilos.

    .comments-page { background-color: #f2f2f2;}
    #blogger-comments-page { padding: 0px 5px; display: none;}
    .comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
    .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
    .comments-tab:hover { background-color: #eeeeee;}
    .inactive-select-tab { background-color: #d1d1d1;}

    Responder

    • Valeu, Márcio!
      O meu problema das abas não terem ficado lado a lado, assim como ocorreu com o Guilherme, funcionou colocando esse trecho antes do 1º “]]>” que aparece ao invés de colocar no CSS.
      Obrigada!

      Responder

    • Refaça o passo 4 assim com o codigo CSS desse jeito: ]]>.comments-page { background-color: #f2f2f2;}
      #blogger-comments-page { padding: 0px 5px; display: none;}
      .comments-tab { float: left; padding: 14px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
      .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
      .comments-tab:hover { background-color: #eeeeee;}
      .inactive-select-tab { background-color: #d1d1d1;}

      Responder

  84. Marcos muito obrigada, já faz uns 8 meses que o seu blog é super útil para mim, eu nunca entendia NADA que explicavam nos outros blogs e quando descobri o Ferramentas Blog, não largo mais. Tudo que eu aprendi até hoje sobre códigos e etc devo a você. Obrigadaa!!!

    Responder

  85. parabés pelo post já compartilhe nas minhas tres redes sociais mais a minha ultima duvida em quantos está o valor de exibição ex: mostrando 5 comentarios do facebook ?

    Responder

  86. É… infelizmente só aparecem as abas depois que se faz um comentário no Blogger. 🙁 O post já aparece com o formulário padrão do Blogger e não dá nenhuma opção de comentar pelo Facebook.

    Isso não tem solução? Ninguém sabe a solução pra esse problema?

    Responder

    • Ola, eu consegui arrumar isso apagando o que está depois de “.comments-page” da primeira linha, ficou assim:

      .comments-page
      #blogger-comments-page { padding: 0px 5px; display: none;}
      .comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #f2f2f2;}
      .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
      .comments-tab:hover { background-color: #eeeeee;}
      .inactive-select-tab { background-color: #d1d1d1;}

      Responder

      • xi pode esquecer o que eu disse, funciona quando já tem algum comentário pelo blogger mas se não tiver nenhum comentário fica só exibindo a caixa do blogger como se você não tivesse feito nenhuma alteração

        Responder

  87. Fiquei com medo de fazer esse e depois não conseguir voltar ao original.. Já que não sei mexer direito em HTML. Mas adorei a idéia, pode ser que eu arrisque no futuro! Bjinhos.

    Responder

  89. Muito obrigada pela dica *-*
    Passei horas procurando e o seu funcionou perfeitamente \\o//
    Coloquei a parte do CSS direto no HTML e as abas funcionaram direitinho :3
    Obrigada de novo o//

    Responder

  90. Marcos, parabéns !!! Ficou ótimo, confessso que apanhei um pouco até conseguir configurar o blogger direitinho, mas no fim deu tudo certo. Só tenho duas observações :

    1° Meu blog tem o fundo dark e quando lemos os comentários do facebook acaba-se dificuldando pelo fato de a fonte ser da mesma cor praticamente;

    2° O íncone do blogger tem um tamanho muito maior do que o do facebook.

    Se você puder postar alguma solução pra isto, aí sim ficará perfeito !!!

    Abraço e parabéns pelo trabalho !!!

    Responder

  91. Eu tenho o mesmo problema q outras pessoas, fiz tudo, porém o meu nao fica em aba oq posso fazer? Ele acima, logo abaixo da postagem.

    Responder

  93. Olá Marcos Lemos, segui o seu tutorial exactamente como sugeriu no post para integrar os comentários do blogger e do facebook. aparece esse erro: “O plugin de comentários requer um parâmetro href.”

    sabes como posso resolver o problema

    deixo aqui o endereço do blogm, que ainda nao pus no ar, mas desbloqueei para que você possa visualizar o erro.

    [link suprimido]

    Obrigado e fico a espera de uma ajudinha.
    Abraço

    Responder

    • Junior,
      Esse erro é comum quando algo é apagado ou alterado no código que apresentamos. Veja com cuidado os passos e aplique num blog de testes antes de fazer em seu blog principal.

      Responder

  95. Show de bola! A única dificuldade que estou tendo seria com relação as notificações que não consigo visualizar ou receber via Facebook, pois como vc sabe temos que ter cuidado quando assunto se trata de comentários dos web leitores…. caso fosse possível uma resposta ou alteração quanto a isso seria mais grato!

    Desde já agradeço!

    Responder

  97. Bom dia Marcos Lemos, estou tendo problemas com o formulario de comentariso do facebook, formulario este que permite a moderação, o erro é o seguinte:

    “Aviso: este plugin de comentários está operando no modo de compatibilidade, mas não tem publicações ainda. Considere especificar um ‘href’ explícito como sugerido na documentação do plugin de comentários para aproveitar todos os recursos do aplicativo.”

    caso possa me ajudar a resolver o problema eu agradeço muito.

    Responder

  98. Marcos Lemos, muito bom tutorial, seu blog é muito útil já utilizei várias dicas suas e dessa vez fiz tudo da forma indicada e aconteceu o seguinte: As abas não ficaram lado a lado, ficou uma em cima da outra e ainda a do facebook ficou meio discreta, bem menor que a aba do blogger. Pode me ajudar? O q devo fazer?

    Responder

  99. Ola, tudo bem?!?!!
    Eu precisava de uma ajuda, porque eu coloquei exatamente como você falou… e no “ultimo” post tinha funcionado perfeitamente… ai eu fui e fiz uma nova postagem e somente aparece a opção do blogger de comentarios, ja no agora penultimo post aparece perfeitamente o do facebook e do blogger.. o que eu precisarei fazer?

    Responder

  100. Deu tudo certo com o codigo, mas me surgiu um problema que não to conseguindo resolver. os comentarios existentes feitos pelo sistema blogger padrão ficam com fonte branca e não dá pra ler, a do facebook fica normal.
    eu tentei mudar a cor do fundo dos formularios pra cinza, mas nessa cor, os comentarios feitos via facebook ficam pretos ( e esquisitos de se ler em contraste com o cinza).

    como mudar isso?

    agradeço desde já.

    Responder

  101. Estou com um problema com este sistema, pois toda vez que alguém comenta pelo blogger, o formulário do Facebook desaparece, mesmo se tiver algum comentário. Para que os comentários pelo facebook aparecer novamente tive que ir no painel e bloquear os comentários pelo blogger, o que acaba fazendo a proposta do aplicativo (que é poder comentar pelas duas plataformas) se perder. Pena.

    Responder

  102. Já estava sofrendo pq não estava funcionando, mas lendo os comentários fiz os ajustes necessários. Meu amigo vc salvou a pátria, já estava com dor de cabeça devido aos comentários do blogger.

    Sucesso

    * Só uma dúvida não ficaram organizadas como na imagem, como posso alterar?

    Responder

  110. Então eu tenho dois blogs,eu fiz primeiro em um para testar e deu certo só que no segundo não deu e eu fiz direitinho,o que será que deu errado? Eu não tenho moderação de comentário nesse blog,please Help me

    Responder

  111. Eu não tenho nenhum sistema de comentario a não ser o padrão do blogger, eu preciso fazer algum antes deste que apresenta neste post ?? ou posso partir daqui ? .. ou tenho que primeiro colocar o do facebook pra depois colocar o de abas?

    Responder

  113. Obrigado por responder meus comentarios..
    eu fiz e deu certo, primeiro fiz só com o do face… mas apareceu a seguinte menção
    ” O plugin de comentários requer um parâmetro href. ” não sei o que significa e nem sei como resolver, se souber por favor me explique como resolver

    Responder

  114. Em primeiro lugar, Marcos, obrigado por nos ensinar como integrar os comentários do facebook em nossos blogs. Eu tento isso faz muito tempo, mas só obtive êxito anteontem, quando me deparei com essa sua página. Muito obrigado.

    Após concluir o passo a passo desta página, consegui integrar os comentários do facebook mas percebi que, as postagens que ja haviam recebido comentários do Blog, não abriam a aba para comentários no facebook. E, nos posts onde não há comentários e fiz algum comentário na aba do facebook, ainda na mesma postagem, quando fui testar o coment do blogger, este ficou soberano e ocultou a aba do facebook – inclusive o comentário feito por mim poucos minutos antes.

    A pergunta:

    Você sabe como corrigir isso? Como posso manter as duas abas ativas, independente de ja haver comentários do blogger?

    Mais uma vez deixo o meu obrigado. Sucesso.

    Responder

  115. ficou bom mais falta uma coisa meu template é escuro eu coloquei o sistema do Fb pra ser escuro tbm mais quando fiz o tutorial a caixa de comentarios ficou branca onde fica o codigo pra mudar a cor da caixa de comentarios no template?
    Obg, abraço….

    Responder

  117. Eu fiz e ficou direitinho, mas depois que as pessoas comentam pelo blog a opção do facebook some e fica só a do blogger. Será que esse é um erro por causa do meu layout ou o que? De qualquer forma muito obrigada pelo tutorial.

    Responder

  118. Marcos, consegui instalar, mas quando alguém comenta pelos comentários do blog, os do Facebook desaparecem . Tens como me ajudar? Não sei o que está acontecendo.

    Responder

  119. Olá Marcos, eu venho acompanhando o blog à um tempo e já havia aplicado esse modelo de comentário, porém mudei o template de um blog novo e precisei refazer o processo, desta vez usando o modo informado aqui, deu certo, porém acontece como nos comentários logo acima, quando comentam pelo blogger some a opção de comentar pelo Facebook.
    Gostaria de saber também se seria melhor utilizar o sistema de comentários do Disqus, citado em alguns dos comentários e se pode ser aplicado ao blogger.
    Fico grato pela atenção e parabéns pelo belo trabalho.

    Responder

      • Cara, os últimos comentários estão todos pedindo uma solução pra quando alguém comentara pelo Blogger a plataforma dos comentários pelo Facebook não desaparecer. Estou com o mesmo problema e já pesquisei e pesquisei e não consigo achar uma solução. Nos ajude por favor. Obrigado.

        Responder

  121. Oi Marcos, tudo bem?

    Cara, fiz tudo certinho, do jeito que está aí. E já faz alguns meses, acredito que mais ou menos um ou dois dias depois que você fez esta mesma postagem aqui, explicando, tudo direitinho. Ou seja, está funcionando. Porém (tem sempre um porem) acontece o seguinte, o formulário de comentários do face só aparece se primeiro for comentado no blogger. Por isso isso acontece? Estou com um conflito danado, já pensando em desistir do jeito que se encontra e passar apenas à usar o formulário do face, conforme você já postou outro tutorial. Mas, antes, gostaria de saber se tem como concertar esse probleminha, de maneira que não aconteça de perder alguns comentários interessantes em minha página.

    Fico no aguardo de tua resposta, ok

    Um abraço campeão e até mais!

    Sucesso, sempre!

    Responder

  122. Olá Marcos, coloquei no meu blog ficou legal, mas nos posts que já tinham comentários, não apareceu o facebook. Quando testei, num posto sem comentários, estava lá, comentei pelo fb normalmente dai fui testar em comentar no blog e o comentario do facebook sumiu.

    Responder

  123. Ficou simplesmente show de bola!

    Fiz recentemente mais uma mudança de meu template e uma de minhas preocupações era com respeito comentários de quem acessa meu blog, os anteriores. Fiz a mudança, e seguindo os passos direitinho, conforme está aqui, tudo está funcionando cem por cento.

    Valeu mesmo!!!

    Responder

  125. Amigo tem um tutorial não de como faz para criar o APP no FACEBOOK, por que os tutoriall que tem ta desatualizados e não funciona mais, já tentei de todas as formas aqui e acho que não deu ?

    Responder

  126. Acontece o seguinte: Quando o meu tamplete tinha só uma coluna os comentários do face e do blogger ficava alinhado como o da imagem, só que depois que eu coloquei mais uma coluna (sidebar) as caixas de comentárias e do face do blog ficara desalinhadas. olhem em algum post do blog

    Responder

  127. Marcos, parabéns, pelo seu post ficou mais fácil. Mas eu tive algumas situações:
    1) o logo do face não aparece, só o do blogger
    2) se for feito um comentário do blogger o do face some e só aparece se deletar o comentário do blogger definitivamente.
    Você tem sugestões para essas questões.
    Grata!

    Responder

  128. Oi, Marcos. Não conhecia seu blog e agora vou assinar. Adorei.
    Fiz o procedimento porém já havia incluído receber comentários pelo FB. Agora que fiz o seu procedimento, parece que não deu muito certo pois aparecem as duas abas mas a do blogger não fica habilitada para receber os comentários.
    Tem como eu excluir a primeira inclusão que fiz há tempos atrás dos comentários do FB e deixar somente a sua? Como faço para localiza-la?

    Responder

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.