Em meu blog de códigos tenho, há algum tempo, um contador de visualizações individuais para posts que sempre gerou muita curiosidade.
Sempre me pedem pra ensinar como coloquei, mas nunca me animei por um motivo bem simples: para blogs mais antigos, com bastante posts, ele é meio injusto.
Explico: é que esse contador só começa a contabilizar os views à partir de sua instalação, ou seja: não conta as visualizações que cada post já tenha.
Tem outro detalhe: ele nem sempre mostra a quantidade exata de visualizações.
Um exemplo é este post:
As estatísticas do Blogger dizem que ele tem, até agora, pouco mais de 30 mil views. O contador mostra bem menos, pouco mais de 26 mil.
Não sei o motivo, mas creio que seja porque o contador só contabiliza 1 acesso por IP. Ou porque, quando chega em um número grande de acessos ele simplesmente pára...
Não tenho certeza do motivo,mas deixo avisado, ok?
Outra coisa que acho importante mencionar é que o site Firebase possui um plano gratuito, que é o que eu uso em meu blog de códigos e de testes, e possui também um plano pago.
A má notícia é que o plano gratuito não "dá conta" de blogs com muitos acessos.
Ele não suportaria, por exemplo, este meu blog principal que em dias de muitos acessos pode passar dos 15 mil views.
Mas se seu blog tem menos acessos ele suporta sem problemas.
Considerações feitas, vamos aprender?
Como instalar no blog o contador de visualizações individuais de cada post?
Para começar você precisa estar logado em sua conta Google, essa mesma do seu blog.
A seguir acesse esse site:
https://console.firebase.google.com/
Na página que abrir clique no botão azul Criar novo projeto. Assim:
Na página que abrir escolha um nome para o projeto (sugiro o nome de seu blog, tipo elainegaspareto, por exemplo) e selecione seu país. Clique em Criar projeto.
Anote o endereço que foi gerado ao criar o projeto.
No caso do meu teste o endereço gerado foi testes-2e5e5.firebaseio.com.
Reserve esse endereço.
Se não conseguir anotar basta voltar à página inicial, ali está o endereço de seu projeto.
Projeto criado?
Abra a página com os códigos necessários à realização deste tutorial, e a mantenha aberta:
Instalando o contador no blog:
Agora vamos ao blog onde você deseja inserir o contador.Clique na aba Modelo, e a seguir clique em Editar HTML.
Dentro da caixa de código tecle, simultaneamente, Ctrl+F.
Na barra de busca que surgir digite ]]></b:skin> e tecle Enter para localizar.
Acima disso cole o CÓDIGO CSS.
Salve.
Agora localize a tag de fechamento </body> e acima dela cole o CÓDIGO JAVASCRIPT.
Preste atenção agora!
No campo onde você lê SEU ID AQUI apague e coloque o seu endereço gerado no site Firebase.
Isso é fundamental, não esqueça!
Salve.
Feito isso vamos instalar o contador onde ele deve aparecer.
Localize essa linha em seu código-fonte:
Oi Elaine, é a Vi,como sempre, seus tutoriais é bem explicadinho, parabéns.
ResponderExcluirMuitos beijos,Vi
Oi, Elaine, adorei! Só que o meu só fica carregando em círculo, por que será? Obrigada, bjs!
ResponderExcluirÉrica, pode ser algum conflito com algo que já exista no blog.
ExcluirAconteceu com um dos meus testes, em geral se tiver scripts que usam o mesmo jquery pode acontecer de um anular o outro.
Interessante..
ResponderExcluirVou testar no meu blog.
bjos
Excelente diga Elaine! Pena que ele não contabiliza os acessos que o post já recebeu anteriormente,
ResponderExcluirAbraços!
NOSSA VIREI JA SUA FÃ POIS TO MONTANDO UM BLOG SOMENTE COM SUAS DICAS E SEUS CODIGOS ESTOU MUITO FELIZ OBRIGADA POR TUDO
ResponderExcluirOu seja tá copiando kkk
ExcluirOBRIGADA JA COMPARTILHEI N FACE
ResponderExcluirBom dia Deu problema o blog não aceita : Client doesn't have permission to access the desired data.
ResponderExcluirAqui não deu certo..não aparece o contador!
ResponderExcluirPenso a Elaine esqueceu de falar no JQuery aqui neste post, que está na outra página dos códigos. :)
ResponderExcluirAki nao deu certo nao aparece o contador :(
ResponderExcluirQual o endereço do blog?
ExcluirTem alguns scripts que conflitam, pode ser isso...
Essa parte do código esta correta?
ResponderExcluirvar blogStats = new Firebase("//SEU ID AQUI.firebaseio.com/pages/id/" +
E que notei que em vez de ( : ) depois do Http tem (;) e assim mesmo?
Sim, exatamente como está no código.
ExcluirMas atente ao fato de que pode haver conflito em alguns temas, tem que testar sempre :)
Ola Elaine, infelizmente a ultima Tag no meu template nao aparece, qoue faco?
ResponderExcluirProcure a área abaixo do título do post, e faça testes até achar o lugar certo...
Excluir