Entrada destacada

PÁGINA DE BIENVENIDA

PÁGINA DE BIENVENIDA

Poner Paginación en Blogger Fácilmente

Poner Paginación en Blogger Fácilmente





Poner paginación en blogger es muy fácil, siempre es mas complicado cuando tienes que liarte con la plantilla, pero esta vez Aun que tienes que ir ya os digo que son dos pasos Facilisimo. 
Hora veremos cómo hacerlo, así que si tu blog aun no tiene una barra de paginación y quieres agregar una, en este post veremos cómo podemos agregar dicha barra de una manera muy fácil y rápida. 


El meto 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;
}

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>


Una vez guardado el código muévelo 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 un generador de códigos de colores. 



Fecha: 09/11/2018

Fuente:   masaudaz.    

Publicado por: 
                                        





CONVERSATION

0 comentarios:

Publicar un comentario

AddToAny

Printfriendly

Back
to top