Postagens populares personalizadas para blog- modelo pronto para usar - * Blog Elaine Gaspareto *

Postagens populares personalizadas para blog- modelo pronto para usar

Publicado em 17/04/2018

Tempo de leitura:


Sabe o widget Popular posts, as Postagens mais vistas, do Blogger?
Eu considere esse um dos elementos de página mais importantes do blog, bom pra divulgar os posts mais vistos e bom, portanto, para reter o leitor um pouquinho mais de tempo no blog.
Já mostrei aqui no blog inúmeros modelos prontos para personalizar os postagens mais vistas do blog.
Hoje quero te mostrar mais um, bonito e bem interessante.
Esse:

Demonstração do tutorial

Vamos aprender?
Antes de começar, algumas dicas importantes:

1- Sempre faça essas alterações que envolvem editar o código-fonte do blog em um blog de testes.
2- Não funciona nos templates responsivos nativos do Blogger tipo Empório, Soho, Contempo e Notável, e nem nos modelos de visualizações dinâmicas pois esses modelos praticamente não aceitam edições.
3- Antes de realizar o tutorial instale em seu blog, caso ainda não tenha, o widget Postagens mais visitadas.
4- Caso já tenha personalizado as Postagens mais visitadas antes precisa retirar a personalização anterior ou inserir mais um widget.
5- Se for usar a fonte que sugiro no tutorial cole o CÓDIGO DA FONTE acima de <head> e salve. Pode trocar a fonte Roboto pela fonte que desejar.
Escolha aqui: Google Fonts

Dicas anotadas?
Abra a página com os códigos necessários à execução do tutorial:

Copiar os códigos


A seguir acesse a aba Tema de seu blog e clique em Editar HTML.
Dentro da caixa do código fonte tecle Ctrl+F e na barra de busca que expandir digite ]]></b:skin> e tecle Enter para localizar.
Acima dessa tag de fechamento da folha de estilos do blog cole o CÓDIGO CSS.
Salve. Depois você poderá editar esse código para alterar coisas como cor e fonte.

Agora, dentro da barra de busca, digite </body> e localize.
Acima dessa tag cole o CÓDIGO JAVASCRIPT e salve.

Agora preste atenção!
No alto da página onde você está, ou seja, o código-fonte de seu blog, tem uma caixinha chamada Ir para um widget. Clique nela.
Localize o widget PopularPosts1
Vai ser um código grande, que começa com <b:widget id='PopularPosts1' e termina com </b:widget>
Selecione tudo que estiver nesse código e substitua-o pelo CÓDIGO DO WIDGET PERSONALIZADO.
Salve.
E tá feito!

Quer uma ajuda extra pra realizar o tutorial?
Veja o vídeo abaixo, onde eu mostro o passo a passo completinho pra te auxiliar.
Aperta o play!


Leitura recomendada:







2 comentários via Blogger
comentários via Facebook

2 comentários:

  1. Obrigada Elaine! Deus te abençoe sempre.

    ResponderExcluir
  2. Amei essas postagem, e usei esses recursos no meu blog, gostei muito.

    https://www.andreiapaula.com.br/

    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…