Como colocar um contador de tempo de leitura de cada post no blog - * Blog Elaine Gaspareto *

Como colocar um contador de tempo de leitura de cada post no blog

Publicado em 19/09/2018

Tempo de leitura:

Como colocar um contador de tempo de leitura de cada post no blog
No tutorial de hoje eu vou te mostrar como colocar em seu blog um contador que marca o tempo aproximado que será gasto na leitura de cada post do blog.
Não sabe do que estou falando? Olha ali abaixo do título desse post. Viu a marcação Tempo de leitura? Então, é disso que estou falando.

Vou te mostrar como inserir em seu blog, é simples e fácil e com meu tutorial vai ser mole mole de fazer.
Antes, porém, um aviso:
Comece, como sempre eu recomendo, testando em um blog de testes. Assim você ganha confiança, se familiariza com o passo a passo e quando fizer em seu blog real vai se sentir mais seguro.

Como colocar o contador de tempo de leitura no blog?


Agora sim, vamos trabalhar?
Acesse a aba Tema do blog onde vai instalar o contador de tempo de leitura do post.
Aí clique em Editar HTML e dentro da caixa do código fonte tecle Ctrl+F.
Na barra de busca que expandir digite </body> e tecle Enter para localizar.
Acima dessa tag de fechamento cole o CÓDIGO JAVASCRIPT.
Salve.

Localize a tag de fechamento ]]></b:skin> e acima dela cole o CÓDIGO CSS.
Salve.

A seguir, na barra de busca, digite <div class='post-header-line-1'/> e localize.
Aparecerão (provavelmente) 2 ocorrências dessa linha.
Estamos em busca da 2ª ocorrência, ok?
Abaixo da linha localizada cole o CÓDIGO HTML e salve.

Entre em qualquer post e espere o carregamento da página. Seu contador já estará aparecendo.
Ah, ia esquecendo, os códigos necessários ao tutorial:


Copiar os códigos

Como colocar um contador de tempo de leitura de cada post no blog

Alertas muito úteis para instalar o contador de tempo de leitura sem erros


1- O contador está configurado para aparecer somente nas páginas internas do post. Na página inicial ele não funciona corretamente. Então deixe como eu fiz, ok?

2- Colar o CÓDIGO HTML abaixo de <div class='post-header-line-1'/> vai colocar seu contador abaixo do título do post.
Pode ser em outro lugar? Pode, mas aí é por sua conta, ok?

3- Cor do contador, tamanho da fonte e posicionamento você altera no CÓDIGO CSS. Deixei marcado onde alterar caso queira, ok?

Qualquer dúvida diga aí nos comentários e caso sua pergunta não esteja já contemplada no tutorial eu respondo tão logo seja possível.
Aproveite, divirta-se!
Blogar tem que ser divertido...
Né?






0 comentários via Blogger
comentários via Facebook

Nenhum comentário:

Postar um comentário

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…