Código para Numeração de páginas com Scroll para Blogger

 Numeração de Páginas com Scroll
 
--> Este trabalho encontra-se hospedado no site www.abu-farhan.com.
Abu-Farhan compartilhou com nós um código para colocar numeração nas páginas do blogue,
com capacidade de suportar mais de 500 postagens!
Aqui vou vos partilhar o  trabalho de Abu-Farhan, adaptando-o e traduzido para Português!



Passo 1: Aplicar estilo

     Acesse ao Painel do Blogger e navegue até Layout> Editar HTML
   Não clique na caixa que diz "Expandir modelos de widgets" e
Encontre a Tag :

]]></b:skin>
E subestitua por:
  
.paginator {
 margin-top:60px;
 font-size:1em;
}
.paginator table {
 border-collapse:collapse;
 table-layout:fixed;
 width:100%;
}
.paginator table td {
 padding:0;
 white-space:nowrap;
 text-align:center;
}
.paginator span {
 display:block;
 padding:3px 0;
 color:#fff;
}
.paginator span strong,
.paginator span a {
 padding:2px 6px;
}
.paginator span strong {
 background:#ff6c24;
 font-style:normal;
 font-weight:normal;
}
.paginator .scroll_bar {
 width:100%; height:20px;
 position:relative;
 margin-top:10px;
}
.paginator .scroll_trough {
 width:100%; height:3px;
 background:#ccc;
 overflow:hidden;
}
.paginator .scroll_thumb {
 position:absolute;
 z-index:2;
 width:0; height:3px;
 top:0; left:0;
 font-size:1px;
 background:#363636;
}
.paginator .scroll_knob {
 position:absolute;
 top:-5px; left:50%;
 margin-left:-10px;
 width:20px; height:20px;
 overflow:hidden;
 background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJTpkXMYA-LPraFZ3Z8DblGU9uA5KV8Ei-oGaPjx2YHSLnTMhYYCDBL4h-_gnAMo9pN5snUjEpbDIHKyMp4H1ZkX7BIHvHkzESVBH3SSqNNiEqeggCmFX8CpfGJrVxMr9hXjbIBGns56U/s1600/slider_knob.gif) no-repeat 50% 50%;
 cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
 position:absolute;
 z-index:1;
 top:0; left:0;
 width:0; height:3px;
 overflow:hidden;
 background:#ff6c24;
}

.fullsize .scroll_thumb {
 display:none;
}

.paginator_pages {
 width:600px;
 text-align:right;
 font-size:0.8em;
 color:#808080;
 margin-top:-10px;
}
]]></b:skin>
 Passo 2: Aplicar Javascript
  
Encontre a Tag:
</body>
E substitua por:
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000-forblogger-v1.0.0.js' type='text/javascript'/>
</body>
Passo 3: Personalizar as Etiquetas
(Nota: Se já usa a página de Navegação anterior de Abu-Farhan, 
ignore este passo)
Vá para a página Editar HTML e clique em"Expandir modelos de widgets"
encontre :
'data:label.url'
E substitua por:
'data:label.url + &quot;?&amp;max-results=7&quot;'

E prontos, é isso e espero que tenham gostado! 
Todos créditos para Abu-Farhan!

0 Comments:

Enviar um comentário

Arquivo