Neste tutorial, você aprenderá como implementar e configurar os comentários usando a ferramenta Disqus.com em seu blog.
Comentários da Disqus no Blogger |
Por que ter a Disqus?
Os comentários padrão do Blogger já evoluiu bastante, dando a possibilidade de qualquer um comentar e até mesmo responder diretamente aos outros usuários. O sistema de moderação também está bem desenvolvido, podendo-se até bloquear alguns usuários "deselegantes". Porém, ainda faltam alguns atributos que seriam interessantes, como a possibilidade de avaliar o comentário ou pôr imagens nele, como forma de ilustrar alguma situação.
Assim sendo, é possível colocar um gestor externo de comentários no blog, como a box de comentários do Facebook, da Disqus, dentre outras. Aqui mesmo, já fizemos um tutorial de como pôr comentários do Facebook no blog, mas ele tem um (pequeno) problema: não é responsivo. E o que isso quer dizer? Quer dizer que, se você tem um blog que se adapta a diferentes tamanhos de dispositivos, a caixa de comentário continuará ocupando os mesmos pixels que ocupa numa tela grande, ocultando assim partes dos comentários e criando uma barra de rolagem horizontal.
Atualização (17 de fevereiro de 2015): Agora o código apresentado no tutorial para box do Facebook torna a box responsiva, além de apresentar nativamente uma versão mobile em dispositivos móveis.
Com os comentários da Disqus, seus problemas estão resolvidos. Além de ser responsivo, ele permite avaliar comentários, respondê-los, compartilhá-los em suas redes sociais e anexar imagens. Isso é muito interessante, por exemplo, em um post de tutoriais, como esse. Se o leitor ficou com dúvida em um passo, basta ele tirar um print do que fez e mandar no comentário para o autor.
Isto posto, vamos ao tutorial. E antes de começar, já vem uma grande vantagem: você não precisa mexer em nada do HTML do seu blog!
Atualização (10 de fevereiro de 2016): O layout do site da Disqus foi reformulado. Desse modo, algumas imagens apresentadas abaixo podem estar um pouco diferentes das que você verá no site.
Adicionando a Disqus ao seu Blog
1. Acesse disqus.com e clique em Sign Up.
Clique em Sign Up |
2.1. Para criar a conta, digite seu e-mail, username (apenas letras e números, sem espaços) e password (senha, de preferência, que contenha letras maiúsculas e minúsculas, números e caracteres especiais) e clique em Create Account.
2.2. Ou clique no ícone de uma das redes sociais e siga com a criação da conta.
Crie sua conta |
3. Na próxima janela, clique no ícone da engrenagem (localizada no topo direito da página) e selecione Add Disqus To Site.
Adicione a Disqus ao site |
4. Nesta etapa, você vai criar um perfil para o seu Blog. Em Site name, escreva o nome dele. Em Choose your unique Disqus URL, será gerado um endereço assim que você escrever o nome do seu blog, Você pode alterá-lo, se quiser. Em Category, selecione uma categoria adequada para o assunto do seu blog. Não encontrando um, selecione Others (outros). Logo após, clique em Finish registration.
Crie um perfil para o seu blog |
5. Escolha a plataforma Blogger. Caso não esteja aparecendo essa tela, note a hierarquia das opções: Settings > Install > Blogger.
Escolha a plataforma do seu blog |
6. Nesta etapa, temos três opções, mas realizaremos apenas duas. A primeira é adicionar o widget da Disqus em seu blog. E a segunda, importar os comentários já existentes em seu blog.
Adicionar widget e importar comentários existentes |
6.1. Para adicionar o widget em seu blog, clique em 1 Add <seublog> to my Blogger site. Uma página do Blogger será aberta igual a que aparece na imagem abaixo. Atente-se para o blog selecionado. Em título, deixe como está (não se preocupe, ele não aparecerá no blog). Em seguida, clique em Adicionar widget.
Clique em Adicionar widget |
6.2. Caso você já tenha comentários nas suas postagens do blog, você pode importá-los. Dessa forma, você não perderá esses comentários, pois eles continuarão aparecendo nos posts. Para importar, clique em 2 Import your existing Blogger comments into Disqus at Tools>Import. Aparecerá duas opções. Note a hierarquia: Discussions > Import.
Opções para importar e sincronizar comentários |
6.2.1. Clique em Import comments from Blogger. Será aberta uma janela do Blogger informando que um aplicativo está solicitando acesso. Basta clicar em Permitir.
Clique em Permitir |
E logo após, selecione o blog correspondente.
Selecione o seu Blog |
6.2.2. Caso você queira sincronizar os novos comentários da Disqus com o sistema do Blogger, clique em Enable syncing (ver imagem do passo 6.2).
No caso do meu blog, quando ativei a opção para sincronizar os novos comentários, ao recebê-los, eles apareciam na postagem normal, assim como no painel da Disqus. Porém, no painel do Blogger, eles apareciam na última postagem do blog. Por esse motivo, desativei a sincronização e desabilitei os comentários no Blogger. Dessa forma, continuo recebendo os comentários pelo Disqus, mas eles não são contabilizados no painel do Blogger. Esse bug pode ou não acontecer com o seu blog.
Editando a box de comentários
Você já deve ter percebido que tudo está funcionando corretamente, mas as opções na box estão em inglês: comments, share, etc. Para deixar tudo em português, além de fazer outras alterações, clique em Settings.
Personalize a box |
A primeira box destacada indica que a importação de comentários está ocorrendo. Quando ela for finalizada, aparecerá uma notificação em verde. Para melhor visualização, separamos duas seções na imagem acima. Na primeira (com bordas azuis), você altera a aparência da box, como a cor do tema e o texto que aparecerá ao lado do seu nome quando você comentar em seu próprio blog, Por padrão, aparece Mod (de moderador). Na segunda seção, você define como quer que apareça a contagem dos comentários.
Rolando a página, você verá várias opções. Vá editando conforme as suas necessidades. Você pode alterar o idioma para o português do Brasil ou o europeu.
Selecione Portuguese (Brazil) ou apenas Portuguese (de Portugal) |
Após todas as alterações, não se esqueça de clicar em Save Changes (Salvar alterações).
Quer ajudar o nosso blog?
Este tutorial foi útil pra você? Te ajudou a melhorar o seu blog? Então nos ajude também, dê like, comente e compartilhe este post. Ah, e deixe também sua doação em dinheiro:
Conclusão
Após esse gigante tutorial, sua box de comentários da Disqus deve estar funcionando. Agora os seus leitores poderão comentar com mais opções, como inserir imagens e avaliar os outros comentários.