Como usar os comentários do Facebook e do Blogger ao mesmo tempo, no blog - * Blog Elaine Gaspareto *

Como usar os comentários do Facebook e do Blogger ao mesmo tempo, no blog

em 04/09/2017

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

Anos atrás eu publiquei um tutorial que ensina como usar no blog, ao mesmo tempo, os comentários do Facebook e os do Blogger.
Relembre:
Colocar os comentários do Facebook junto com os do blog
Ele funciona mas de lá pra cá o Facebook passou por atualizações e as telas que mostro no tutorial mudaram, bem como a forma de criar o aplicativo que faz a mágica acontecer.
Então, bora atualizar o tutorial, e incluir melhoramentos nele?
Quer aprender? Vem comigo!


Importante:
Para começar você precisa ter um aplicativo criado no Facebook Developers. Caso você já tenha um aplicativo criado pode pular essa etapa.
Se ainda não tem siga o passo-a-passo abaixo e crie o seu; ele é indispensável para este tutorial.


Como criar um aplicativo no Facebook


Para começar, caso você nunca tenha criado nenhum app assim no Facebook for developers você verá essa tela:


Clique em Começar (ou Criar um aplicativo, podem aparecer ambas as formas no botãozinho azul).
Você será então direcionado para esta tela (caso nunca tenha criado nenhum app):


Clique em Avançar.
A tela seguinte será essa:

Preencha conforme marquei nos campos e clique no botão azul.
Preencha com o captcha pedido e a seguir clique em Enviar.
Aparecerá a tela:


Clique em Revisão do aplicativo e na janela que expandir marque a opção Sim em Tornar seu aplicativo público.
Confirme a opção, escolha uma categoria para seu aplicativo (sobre o que é seu blog? Escolha a categoria mais próxima disso) e pra finalizar clique em Confirmar.

Essa parte terminamos.
Mantenha a página aberta pois você precisará do ID do aplicativo daqui há pouco.
Agora abra também a página com os códigos necessários à realização do tutorial:


Copiar os códigos


Agora vamos ao painel do blog onde você deseja inserir os comentários via Facebook. Sugiro que teste antes em um blog de testes que tenha o mesmo template de seu blog oficial, ok?


Como instalar os comentários do Facebook junto com os comentários do blog



No painel do blog acesse a aba Tema (ou Modelo, é a mesma coisa) e clique em Editar HTML.
Dentro da caixa do código-fonte tecle Ctrl+F e na barra de busca que expandir digite <head> e tecle Enter para localizar.
Abaixo de <head> cole o CÓDIGO DE PROPRIEDADE.
Observe que é <head>, uma tagde abertura, diferente de </head> que é uma tag de fechamento que usaremos daqui há pouco. Ok?
Copie o número de identificação de seu aplicativo, aquele que aparece em ID do aplicativo e cole no campo marcado com SEU ID DO APLICATIVO. 
No campo marcado com SEU USUÁRIO FACEBOOK coloque seu nome de usuário do Facebook, exatamente como aparece no seu perfil. O meu, por exemplo, é elainegasparetoparada.
Fez todas as inserções?
Salve.

Na barra de pesquisa digite ]]></b:skin> e tecle Enter para localizar.
Acima de ]]></b:skin> cole o CÓDIGO CSS.
Salve.

Na barra de busca digite </head> e localize.
Acima dessa tag de fechamento cole o CÓDIGO JAVASCRIPT.
Salve.

Agora, na barra de pesquisa digite isso:



E tecle Enter para localizar.
Você achará essa ocorrência 2 vezes.
Abaixo de ambas as ocorrências cole o CÓDIGO HTML.
Sim, abaixo das duas ocorrências do trecho localizado cole o CÓDIGO HTML.
Salve.

Se tudo deu certo você verá os comentários do Blogger e do Facebook exatamente como em meu exemplo.
Preste atenção agora as dicas extras que ensinarão como personalizar cores, fontes, ícones e como moderar os comentários feitos via Facebook.


Dicas extras sobre como personalizar, notificações e dúvidas frequentes


1- Notificações dos comentários feitos via Facebook:
Você receberá notificações em seu Facebook, normalmente como recebe qualquer notificação.
Mas caso prefira acesse https://developers.facebook.com/tools/comments e veja se há comentários feitos em seus posts.
Eu acesso ao menos uma vez por dia pra não perder nada.

2- Para funcionar sem erros seu formulário de comentários precisa ser do tipo Incorporado. 
Altere, caso precisar, em Configurações/Postagens, comentários e compartilhamentos/Comentários/Local do comentário.
Não pode usar os comentários do G+, apenas os nativos do Blogger, ok?

3- Para alterar coisas como cor de fundo das abas, tamanho e tipo da fonte e tamanho dos ícones F e B das abas o local é o CÓDIGO CSS.
Para alterar a imagem dos ícones o local é o CÓDIGO HTML. Deixei marcado em negrito o endereço dos ícones, altere se desejar pelo endereço dos ícones que preferir.

4- Caso queira alterar a frase Comentários via Blogger e Comentários via Facebook o local para isso é o CÓDIGO HTML.
Não esqueça de manter igual em ambas as vezes que colar esse código, ok?


Execução em vídeo do tutorial Como usar os comentários do Facebook e do Blogger ao mesmo tempo- aperta o play!



Para não deixar dúvidas eu gravei a execução do tutorial em uma vídeo-aula.
aperta o play, se inscreve no canal de apoio aos tutoriais do blog e se tiver perguntas, diz aí e eu ajudo no que for preciso!




Ah, não deixa de pelo menos curtir o post, tá? Sei que nem sempre dá tempo de comentar, mas só um clique em Curtir já me deixa tão felizinha...
#curte....



7 comentários via Blogger
comentários via Facebook

7 comentários:

  1. Vira e mexe tudo muda e lá os tutoriais ficam obsoletos, aff...

    Eu queria essa paginação como essa interna do teu blog, que invés de mostrar postagens antigas/recentes, mostra o título respectivo. Vc tem o tutorial? Se não tem, põe na fila dos próximos, please 🙏🙏🙏

    Gratidão!

    ResponderExcluir
  2. Elaine, Boa Noite, tenho acompanhado o seu blog e gosto muito das postagens, me ajudam bastante... Agradeço muito a sua disponibilidade em ajudar os blogueiros de primeira viagem, parabéns pela iniciativa.
    Preciso que vc me ajude em uma coisa, eu estava aqui mexendo nas configurações do meu blog e sem querer eu ocultei o box de comentários das postagens, eu já tentei e eu já mexi nas configurações-->comentários-->local dos comentários--> aqui eu coloco incoporado, mas não aparece nada no meu blog, o que eu faço agora? as permissões para as postagens estão todas corretas tbm, o box do meu blog teste também sumiu, tentei instalar o Disqus mas também não funcionou.... Já Restaurei o Html do Blog e nada, Tem como resetar as configurações pra voltar tudo como era antes??
    Espero que vc me responda, estou desesperada...

    ResponderExcluir
  3. Oi Elaine, desculpe incomodar, mas será que você poderia me ajudar?
    Uso um dos seus templates gratuitos, ele veio com a caixa de comentários do facebook inclusa, as pessoas conseguem comentar normalmente, só que eu não recebo notificação de que as pessoas comentaram nem aparece no meu painel da ferramenta de moderação (developers.facebook.com/tools/comments)os comentários dessas pessoas (o que me obrigaria a ter que ir de post em post todo dia ver se tem comentário novo).
    Tentei colocar esses códigos do tutorial para ver se eu passaria a conseguir ver esses comentários, mas continuo não vendo os comentários das pessoas no painel developers.
    Você tem alguma ideia do que possa estar acontecendo? Ou poderia me dizer qual parte do Template Aquarela Rosa eu tenho que tirar para tirar a caixa de comentários do facebook do blog e tentar recolocá-la para ver se volto a ter acesso ao comentários do facebook?

    ResponderExcluir
    Respostas
    1. Marijleite, eu não sei dizer o que há.
      Se fez a criação do app certinho e configurou corretamente deveria estar vendo os coments...
      Para retirar os comentários siga o tutorial que listei acima, no começo deste post, mas ao contrário. Ao invés de acrescentar vá localizando os códigos e excluindo-os.
      Foi ele que segui quando desenvolvi o template.
      Espero que ajude :)
      bjss

      Excluir
  4. Fiz no meu blog de testes e deu certinho! Farei no blog oficial depois! Muito obrigada por sempre nos ajudar, Elaine! <3
    Beijos
    Blog Tamaravilhosamente

    ResponderExcluir

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…



Visualizações

Contando...

Dias online
Postagens
comentários