No Blogger, por padrão, você verá as mensagens postagens mais antigas e postagens mais recentes perto da parte inferior da página, que é útil aos visitantes do seu blog para navegar para outros posts do seu blog. Mas, o problema é … as pessoas mal percebem esses links de postagens antigas e recentes .. o que significa .. menos pageviews para o seu blog.

Então, para aumentar as visualizações de páginas do seu blog, você pode usar um hack para numerar a navegação por página.

Então, como adicionar isso ao seu blog do Blogger?
Primeiro faça um Backup do template do Blog

1. Entre na sua conta Blogger » Configurações » Formatação
Escolha o número de mensagens que você deseja exibir na página inicial

2. Agora vá em Design » Editar HTML
Desça até o fundo do código do modelo e encontre este código:

Dica: Para copiar o código, passe o mouse por cima do código, e clique no ícone “Copiar Código Inteiro”.

</body>

Cole este código acima da desta linha

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord ='Anterior';
var downPageWord ='Próxima';
</script>
<script type="text/javascript" src="http://inforlogia.googlecode.com/files/navegacaopgn.js"/>
</b:if>
</b:if>

Nesse código acima, edite a parte var pageCount=5 de acordo com o Passo 1. Ele determina o número de posts que, devem ser exibidos por página. (Tenha certeza, o número definido é o mesmo da Etapa 1)

3. Clique em Expandir Widgets, dê um Control + F e procure por todas as ocorrências deste código:

'data:label.url'

e substitua por este:

'data:label.url + &quot;?&amp;max-results=5&quot;'

Novamente, o número na linha max-results=5 depende do número definido no passo 1.

4. Agora, a parte de estilo, fiz um estilo padrão para você, cole antes de </b:skin>:

.showpageArea a {
text-decoration:underline;
background: #ffffff;
padding: 10px 10px 10px 10px;

}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
border-top: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

Se quiser basta alterar esse ultimo código (css) ao seu gosto 🙂

Créditos: Blogger Plugins