Añadir paginacion o numeracion de paginas en Blogger

Nosotros los bloggers siempre buscamos la comunidad del visitante, por hoy les traigo este truco, lo usaremos pare añadir paginacion o numeracion de paginas de nuestro blog.
El codigo que usaremos es sencillo ya que sólo tenemos que agregar el código de estilo CSS en la plantilla, y añadir un gadget HTML/Javascript. Para ello tienes que seguir los 2 pasos siguientes:

1. Ve a Diseño > Edición de HTML > busca ]]></b:skin> justo antes pega el siguiente código:

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

2.Ahora ve a Diseño > Añadir gadget > elije HTML/Javascript y pega el siguiente código:

<style type='text/css'>.showpageArea a {text-decoration:underline;}.showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 3px;padding:3px;}.showpageNum a:hover {border: 1px solid #cccccc;background-color:#d10000;}.showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}.showpage a:hover {text-decoration:none;}.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style><script style='text/javascript'>var pageCount=5;var displayPageNum=5;var upPageWord="Anterior";var downPageWord="Siguiente";</script><script style='text/javascript' src='http://dl.dropbox.com/u/3373498/PazosBlogger-blogger-page-nav-v2.js.txt'></script>

3.Una vez guardado el código lo movemos debajo de las entradas.


Configuración:
var pageCount=5; (el código está predeterminado para mostrar 5 entradas por página, cambialo por el número que tu quieras, está en rojo en el código).
var displayPageNum = 5; (número de páginas en la lista, está en azúl).


También podemos cambiarle el color a la barra de navegación, combinándola con la plantilla que usemos. Les dejo la tabla de los 140 colores hexadicimales existentes.