Colocando páginas numeras no seu blog/website

Colocando páginas numeras no seu blog ou website !

Hoje vou estar ensinando um recurso que o HTML disponibilizarpara nós , que é muito eficiente para você que é tanto novo quanto velho no blogger.Vou estar ensinando a como colocar páginas numeradas no seu blog ou site via HTML .

Primeiramente ... no seu blog vá na aba Design >> Editar HTML >> e precione as teclas CTRL + F

 

a procure pela tag  : ]]></b:skin>

 

 quando acha-lá , colé o seguinte cógido acima da tag encontrada :

 

  .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/AVvXsEi_WfZ2jrgIG8E0hvztrGlJ-LlVbuRGxnFAAdK03pBW-hiL0twR8eoeZdhCDfrfZ8RskpxtXCYpdhJtpwKYvAsQebJ6tlbp-4V6uKbrg8bVd0xWOEZPe5uQXVSw3Ua5q0_BsR88C6NAmwo/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;

}

Ainda não salve o modelo; depois disso você vai procurar pela tag :

</body>

 

e vai repetir o mesmo processo de antes , você vai colar o sequinte código acima da tag :

 

<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'/>

Agora sim você vai salvar o modelo , e clicar em >> Expandir modelos de widgets

precionando as teclas CTRL+F procure pela tag : data:label.url

achando a tag , você vai trocar por esse código:

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

Pronto , agora salve seu modelo e use o recurso a vontade !

Posted in: Blogger,Dicas,Ferramentas