Como Numerar las paginas del Blog (how to number the pages of the blog?)

Como Numerar las paginas de tu Blog

Cuando tenemos un diseño que no es el estándar de Blogger, nos puede suceder que al querer poner el numero de paginas a nuestro Blog nos vemos en dificultades, para ello muchas veces hay que recurrir a hacerlo a través de la PLANTILLA , para luego EDITAR HTML, y no nos garantiza tampoco el resultado.

Con este pequeño truco  resultara fácil y os garantizo que suele dar muy buenos resultados, aparte de que es mucho mas sencillo ya que lo haremos desde DISEÑO --> añadir un GADGET --> HTML/JAVASCRIP .  Ahi pegaremos este código:

<!-- Stylish colored  Navigation Widget For Blogger By bdlab @ http://24work.blogspot.com -->

<style type="text/css">

#blog-pager{padding:5px 0 !important;}

.showpageArea {font-weight: bold;margin:5px;}/* 24work.blogspot.com */

.showpageArea a {text-decoration:underline;color: #fff;}/* 24work.blogspot.com */

.showpageNum a, .showpage a {color: #fff;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0 3px;padding:3px 5px; background: #3b679e; background: -moz-linear-gradient(top, #3b679e 0%, #2b88d9 50%, #207cca 51%, #7db9e8 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b679e), color-stop(50%,#2b88d9), color-stop(51%,#207cca),  color-stop(100%,#7db9e8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b679e', endColorstr='#7db9e8',GradientType=0 ); }/* 24work.blogspot.com */

.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc; background: #aebcbf; background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a), color-stop(100%,#0a0809)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf', endColorstr='#0a0809',GradientType=0 ); }/* 24work.blogspot.com */

.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px; margin:0 3px;padding:3px 5px; background: #e2e2e2; background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1), color-stop(100%,#fefefe)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#fefefe',GradientType=0 ); }/* 24work.blogspot.com */

.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}/* 24work.blogspot.com */

.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}/* 24work.blogspot.com */

</style><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tips and Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" target="_blank" title="Latest Tips And Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips And Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><script type='text/javascript'>

var home_page="/";

var urlactivepage=location.href;

var postperpage=5;

var numshowpage=3;

var upPageWord ='Previous';

var downPageWord ='Next';

</script>

<script src='http://24work-new.googlecode.com/svn/trunk/24work-blogspot/page-navigation/new-code/0-test-p-n-01_00-ycode.js' type='text/javascript'></script>

<!-- Stylish colored Numbered Page Navigation Widget For Blogger By bdlab @ http://24work.blogspot.com -->

Acordaros, para que funcione  este Gadget hay que ponerlo como esta en la imagen justo debajo de ENTRADAS DEL BLOG

RESULTDO FINAL:

Nota si quereis otros diseños o colores la fuente:

http://24work.blogspot.com/