Paginas numeradas fácil para Blogger

Siga o Ferramentas Blog: Canal no Youtube | Facebook | Twitter | Google+
Acesse AGORA: https://blogueiro.pro e se torne um Blogueiro de Elite.

Há alguns dias atrás eu ensinei como colocar paginas numeradas no blog, mas muitas pessoas tiveram dificuldade para seguir o tutorial, e portanto não conseguiram instalar o gadget paginas numeradas.

Paginas numeradas fácil

Hoje eu quero apresentar-lhes uma solução extremamente fácil, qualquer pessoa consegue faze-lo, não precisa ter conhecimento de código. É extremamente simples.

Como colocar paginas numeradas fácil no blog?

1. Acesse o painel do seu blog

2. Clique na guia “Layout

3. Clique em ‘Adicionar um gadget’ → Escolha tipo’HTML/Javascript’ e cole o seguinte código:

<style type="text/css">
#blog-pager{font-size:normal;padding:10px 0;clear:both;}
.showpageArea{font-family:verdana,arial,helvetica;color:#000;font-size:11px;margin:10px}
.showpageArea a{color:#000;text-shadow:0 1px 2px #fff;font-weight:700}
.showpageNum a{padding:3px 8px;margin:0 2px;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd url(http://4.bp.blogspot.com/_McxL-_3YYuM/TBG_a0U9fJI/AAAAAAAAAAU/qcqAF8aqWME/s1600/wp1.jpg) 0 -50px repeat-x;color:#000;}
.showpageNum a:hover{border:1px solid #888;background:#ccc url(http://4.bp.blogspot.com/_McxL-_3YYuM/TBG_a0U9fJI/AAAAAAAAAAU/qcqAF8aqWME/s1600/wp1.jpg) 0 -25px repeat-x}
.showpageOf{margin:0 2px 0 0;padding:3px 8px;margin:0 2px;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;background:#ddd url(http://4.bp.blogspot.com/_McxL-_3YYuM/TBG_a0U9fJI/AAAAAAAAAAU/qcqAF8aqWME/s1600/wp1.jpg) 0 -50px repeat-x;}
.showpagePoint{color:#fff;text-shadow:0 1px 2px #333;padding:3px 8px;margin:2px;font-weight:700;-webkit-border-radius:3px;-moz-border-radius:3px;border:1px solid #999;background:#666 url(http://4.bp.blogspot.com/_McxL-_3YYuM/TBG_a0U9fJI/AAAAAAAAAAU/qcqAF8aqWME/s1600/wp1.jpg) 0 0 repeat-x;text-decoration:none}
</style>
<script style='text/javascript'>
var numshowpage=7;
var postperpage =6;
var upPageWord="Anterior";
var downPageWord="Próxima";
var home_page="/";
var urlactivepage=location.href;
</script>
<script style='text/javascript' src='http://dl.dropbox.com/u/35784805/Mil%20Trucos%20Blogger/paginacionbloggermtb.js'></script>

4. Clique em salvar

Obs. Você pode alterar a cor, o tamanho da fonte, o tipo da fonte e a cor da fonte.

Até a próxima!

.

57 Comentários

  1. Amei, foi o melhor código, o único que ficou bom no meu blog, você disse que poderia personalizá-lo, eu tentei mas não consegui muita coisa ): Mas o código tá ótimo!

    Responder

  2. Oi, moderadores, eu queria fazer um pedido, eu tirei aquele “postagens antigas”,”postagens recente”, mais não gostei. Aí ficou sem nada, aí como o leitor vai pode ir para as outras postagens?.
    Aí eu queria que vocês fizessem um tutorial explicando como colocar isso denovo.
    Espero que me ajudem…

    Responder

    • Para deixar o fundo preto você deve procura no codigo por: background:#ddd; e
      substituir por: background:#000;

      Se quiser mudar a cor dos numeros você tem que substituir: color:#000;

      Por: color:#fff;

      Responder

  3. Oi Kemuel, obrigado pela atenção… não consegui tirar a faixa escura detrás dos botões em si… ainda assim está bugando porque uso na coluna central com template de 3 colunas… usei em outro blog com duas colunas e ficou de boa. 🙁

    Responder

  4. O seu está bonitinho, se adequando ao espaço… mas o meu quando mudo de página ele se quebra… e parece que aumentam as letras… estranho…
    Vc saberia como retirar o “Assinar: Postagens (Atom)” ? Parece que ele ocupa muito espaço no layout… e joga o campo para as assinaturas muito pra baixo…

    Responder

  5. Vlw Kemuel apagou… porém existe um espaço grande entre seus dois gadgets… a paginação e a assinatura… os dois estão juntos no rodapé… me sugere algo pra retirar este espaço?
    Será que vou bater o Matheus nos comentários? O.O rsrs

    Responder

  6. Bom dia querido Kemuel Stefano,

    Eu adicionei em meu blog um parecido com o do: http://www.escolhidospravencer.com
    Porém no dele há um efeito que ao passar o mouse em cima do número das páginas e nos botões anterior e próximo, há uma movimentação que se forma, fazendo um efeito igualmente em nosso menu. Se o senhor passar o mouse em cima do nosso menu verá que ele faz o mesmo efeito que o site em que te recomendei faz. Porém no meu, o efeito não ocorre na caixa de paginas.
    Poderia me ajudar?

    Até mais!

    Responder

  7. Olá bom dia, ótimo site! já usei várias dicas daqui no meu site porém estou com um probleminha que pode ser um problemão!

    Páginas por categoria não tem limite de postagens por página, por exemplo! se uma tal categoria tem 50 postagens, as mesmas são mostradas em uma só página.

    Eu uso um script de paginas numeradas porém só funciona na pagina inicial! nas de marcadores/categoria não mostra, isso está carregando muito e deixando o site pesado!
    Já imaginou eu clicar em uma categoria e tiver 1000 postagens e todas serem mostradas de uma vez só? tá muito ruim!

    Eu gostaria muito muito muito de sua ajuda! por favor, não sei mais o que fazer!

    Responder

    • Que tal você colocar outro script de paginas numeradas.

      O que você está usando não é esse que postamos, portanto não posso falar porque não conheço o script que você está usando.

      Responder

  8. tenho uma duvida: sabes quando aperta em um genero como por exemplo filmes , vai aparecer as postagens certo? no meu blog aparece umas 20 postagens e some as paginas numeradas , eu qria deixar as paginas numeradas ali teria como ?

    gratisdowns.blogspot.com

    obrigado !

    Responder

  9. Olá queria fazer uma queixa, de que quando adicionei esse link ao meu blog, sim apareceu as páginas numeradas, mas quando me dei conta havia ocultado 2 postagens! Gostaria de saber o que houve? OBRIGADO. Por enquanto estou sem esse serviço. Quando resolverem este problema estarei usando-o novamente. Mas fora isso está perfeito.
    E uma outra coisa que também gostaria de saber é se tem como mudar a cor dos quadrados ou algo do tipo! Obrigado, agradeço a sua atenção. Aguardo a resposta desde já.

    Responder

  10. Muito obrigado Marcos… Esse gadget era tudo que eu tava precisando pra terminar de elegantizar meu blog de matemática… Depois que eu conheci o ferramentas blog meu blog melhorou 1000% minhas visitas subiram e meu layout só melhorou mais e mais…

    Responder

  11. Olá, primeiramente eu quero lhe da os parabéns pelo post muito explicado e foi o único código HTML de paginas numeradas que funcionou em meu blog, mais estou com uma dúvida como faço para mudar as cores ? não estou consigo mudar a cor poderia fazer um tutorial sei lá … e Parabéns pelo post.

    Responder

  12. Você é o Kara. Não sou de fazer post. Mas seria injustiça de minha parte não fazer um agradecimento. Como disseram os amigos de cima. No meu caso tentei mil e uma vezes, e não tinha conseguido. Sua dica foi a única que deu certo. Obrigado … Obrigado … Obrigado.

    Responder

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.