Numeração de páginas no Blogger

O sistema de controle de páginas no Blogger é bem precário.

Na verdade, não há numeração das páginas: só é possível navegar para as “postagens mais antigas” e para as “postagens mais recentes”, de página em página.

Atualmente, a única forma de possibilitar a numeração de páginas é realizando modificações no template.

Veja neste artigo (um dos temais mais votados em meu UserVoice) algumas opções interessantes e de funcionamento comprovado para realizar a paginação no Blogger.

Introdução

Quando você utiliza um template padrão do Blogger, não é simples para que seus leitores visualizem seus artigos mais antigos, especialmente se você não utiliza o gadget “Arquivo do blog”.

Para visualizar postagens antigas, ele precisa clicar na opção “Postagens mais antigas”, no final de sua página, até encontrar o período desejado.

Abaixo está uma imagem do TD Séries mostrando esses controles de navegação em um template padrão:

 A navegação fica bem mais simples quando você utiliza o conceito de “paginação” de seus artigos, em que seu leitor consegue ir até uma página específica.

Veja, por exemplo, o controle que utilizo aqui no Gerenciando Blog: com ele, é possível utilizar o cursor para deslizar até a página desejada e clicar diretamente nela.

 Para fazer isso, é necessário realizar algumas alterações diretamente no HTML do seu template.

Neste artigo, mostrarei duas opções para realizar a paginação, para que você possa escolher o modelo que melhor se adéqua à sua situação.

Ressalto que ambas soluções não foram desenvolvidas por mim, mas pelo Abu Farhan, um ótimo blogueiro da Indonésia, que cria ótimos gadgets para blogs.

Como seus artigos originais estão em inglês – que nem todos dominam – achei por bem reuni-los e citá-los aqui, bem como seus links originais.

Uma recomendação importante: antes de aplicar as alterações em seu blog oficial, sugiro fortemente que você as faça em um blog de testes, para avaliar se elas funcionarão corretamente e não causarão problemas em outras funcionalidades do seu blog.

Caso você ainda não tenha um blog de testes, basta seguir as orientações do artigo Como criar um blog de testes no Blogger.

Caso você tenha dúvidas ou dificuldades para realizar as alterações no HTML do seu template, sugiro a leitura do artigo Como editar o HTML de seu template no Blogger.

Opção 1 – Paginação clássica

Esta primeira opção, que chamo de “paginação clássica”, é que costuma ser mais utilizada nos blogs.

Ela mostra as páginas em pequenos quadros, permitindo que seu visitante clique diretamente nelas.

O tutorial original está em Numbered Page Navigation For Blogger New Script.

O procedimento é bem simples. No HTML do template do seu blog, você deve realizar duas alterações:

1. No início do seu template, logo antes da linha que começa por “<b:skin>”, adicione a instrução abaixo.

Como mostrei no artigo CSS no Blogger: o que é e como usar, isso adicionará os códigos de formatação ao seu template.

<link href=’https://sites.google.com/site/gerenciandoblog/arquivos/paginacao-abu-farhan-01.css’ rel=’stylesheet’ type=’text/css’/>

2. Antes da linha “</body>”, copie o conteúdo do arquivo https://sites.google.com/site/gerenciandoblog/arquivos/paginacao-abu-farhan-01.txt. Há duas linhas que você pode mudar nesse trecho:

• var postperpage=7; – Este número define quantos artigos serão mostrados em cada página do seu blog. Minha sugestão é que você coloque nele o mesmo número de artigos que você definiu para mostrar na página principal do seu blog.
• var numshowpage=4; – Este número define quantas páginas (ou quantos quadros) você mostrará em seu navegador de páginas. No exemplo da imagem que mostrei acima, utilizei 7 páginas.

Se você quiser, pode também utilizar outros estilos de cores e formatações para o navegador de páginas.

Algumas sugestões estão nos artigos abaixo:

• Five Styles Page Navigation for Blogger New Script Part 1
• Five Styles Page Navigation for Blogger New Script Part 2

Opção 2 – Paginação deslizante

A segunda opção, que eu chamei de “paginação deslizante”, é a que utilizo aqui no Gerenciando Blog há alguns meses e considero mais elegante.

Trata-se de um navegador em que o visitante pode utilizar o indicador para “deslizar” entre as páginas, chegando até a página desejada.

Para vê-lo em funcionamento, basta acessar a página principal e ir até o final dela, antes do rodapé.

O tutorial original está em Beautiful New Page Navi For Blogger With Scroll.

O procedimento é bem similar ao anterior, com pequenas modificações.

As duas alterações necessárias no template estão citadas abaixo:

1. Adicione ao seu template, antes do trecho “<b:skin>”, a linha abaixo:

<link href=’https://sites.google.com/site/gerenciandoblog/arquivos/paginacao-abu-farhan-02.css‘ rel=’stylesheet’ type=’text/css’/>

2. Antes da linha “</body>”, copie o conteúdo do arquivo https://sites.google.com/site/gerenciandoblog/arquivos/paginacao-abu-farhan-02.txt. Valem também aqui as mesmas opções de customização que mostrei no item 2 da Opção 1 (postperpage e numshowpage).

Conclusão

A navegação de seus visitantes pelos artigos antigos de seu blog ficará muito mais simples se você colocar nele uma destas opções de paginação.

Estes sistemas são bem mais simples e funcionais do que obrigar seu visitante a clicar diversas vezes nas “Postagens anteriores” até encontrar o que procura.

E você, já utiliza alguma customização para paginar as páginas do seu blog?

Gostou destes sistemas? Deixe um comentário!