Pular para o conteúdo principal

Tutorial: Como colocar uma paginação numerada


          Hoje vou mostrar à vocês um jeito incrivelmente fácil de pôr uma paginação numerada nos blogs de vocês. Quando eu estava procurando esse tutorial há meses atrás, achei dois que não deram muito certo, e em um deles eu tinha que esperar até o dia seguinte para ver se funcionou. Aí não dá né?!
          Foi aí que eu achei o tutorial que eu usei para colocar a paginação que vocês vêem aqui no blog. É muito, mas muito fácil. Esse tutorial foi encontrado no blog Uprising Teen.

          Vamos até "Layout" e vamos adicionar um novo gadget. Adicione então "HTML/JavaScript" e cole isso:

<style type="text/css">
#blog-pager{
font-size:normal;
padding:10px 0;
clear:both;
}
.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
color:#fff; /* COR DA FONTE */
background:#FF4040; /* COR DE FUNDO NORMAL */
font-size: 10px; /* TAMANHO DA FONTE */
}
.showpageOf {
margin:0 8px 0 0;
font-size: 10px; /* TAMANHO DA FONTE */
background: #FFD39B; /* COR DE FUNDO DO TEXTO: Página 1 de... */
}
.showpageNum a:hover {
color:#fff; /* COR DA FONTE (MOUSE EM CIMA) */
background:#8B1A1A; /* COR DE FUNDO HOVER (MOUSE EM CIMA) */
font-size: 10px; /* TAMANHO DA FONTE */
}
.showpagePoint {
color:#000; /* COR DA FONTE SELECIONADA */
padding: 3px 8px;
margin: 2px;
font-weight: 700;
background: #F77795; /* FUNDO SELECIONADO */
text-decoration: none;
font-size: 10px;
}

</style>

<script style='text/javascript'>
    var numshowpage=5; /* NÚMERO DE PÁGINAS A SEREM EXIBIDOS */
    var postperpage =5; /* NÚMERO DE POSTS A SEREM EXIBIDOS */
    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>



          As instruções de como personalizar a paginação já estão no código. Use a Tabela de cores.
          Posicione logo abaixo da área de postagem e salve.

Beijinhos ;*

Comentários

  1. Eeeeeeeeeei te indiquei em um selo lá no blog, corre lá pra ver beeeeeeeeijos http://jooylim.blogspot.com.br/2014/01/selo-versatile-blogger-award-nominations.html

    ResponderExcluir
  2. Olá!! poderia tirar uma duvida?? meu blogger com essa paginação numerada ou qualquer outra só chega ao numero 16, o que eu tenho que fazer para aparecer todas as paginas, meu blogger tem mais de 1500 postagens

    ResponderExcluir

Postar um comentário

Postagens mais visitadas deste blog

Blythe Dolls

         A Blythe Doll, é uma boneca que surgiu nos anos 70, porém, assustava um pouco as crianças. Por esse motivo, saiu de linha um ano após o lançamento.  Em 1997, a jornalista Gina Garan ganhou uma boneca Blythe de presente e passou a fotografá-la em todos os lugares, dando assim inspiração ao seu livro "This is Blythe" (Esta é a Blythe). Em 1999, ela foi introduzida à Junko CWC Wong pelo artista e ilustrador, Jeffrey Fulvimari. Ainda naquele ano, a Hasbro deu à Takara, empresa japonesa, uma licença para produzir uma nova edição da boneca Blythe, a NEO (nova) Blythe. A Blythe foi usada em uma campanha publicitária de televisão por Parco, o ramo de moda da Seibu Department Stores no Japão e foi um sucesso instantâneo. O sucesso no Japão levou a Hasbro a dar uma licença à Ashton Drake Galleries (ADG) em 2004, para produzir Blythes nos Estados Unidos por um preço mais "em conta".            Há dois tamanhos de bonecas Bly...

Template free - Aqua Dark

          Primeiro layout free do blog. Download           Para que seu layout funcione sem erros adiciones esses gadgets:  Menu: Abaixo do cabeçalho adicione o gadget HTML/JavaScript e cole isso: (depois faça as alterações que desejar.) <div id='NavbarMenu'> <div id='NavbarMenuleft'> <ul id='nav'> <li><a expr:href='data:blog.homepageUrl'>Home</a></li> <li> <a href='SEU LINK AQUI'>Contato</a> </li> <li><a href='SEU LINK AQUI'>Unhas</a> </li> <li><a href='SEU LINK AQUI'>Cabelos</a> </li> <li><a href='SEU LINK AQUI'>Looks</a> </li> </ul> </div> </div> <div style='clear:both;'/></div> Barra de pesquisa: Caso não apareça de imediato, na barra lateral adicione o gadget HTML/JavaScript, coloque o título " Pesqui...