Es un aspecto importante en el diseño de nuestro blog, mostrar enlaces que nos lleven a cierta parte del contenido, justamente para ello existen la paginación de posts, muy usado en la blogosfera. Nuestro WordPress por defecto trae los enlaces Anterior y Siguiente, pero si deseamos colocar el número de paginas debemos hacer algo extra. Veamos.
Lo primero que debemos hacer es descargar el plugin WP-PageNavi, luego descomprimimos y copiamos-pegamos los siguientes archivos al directorio de nuestro tema:
- wp-pagenavi.php
- pagenavi-css.css
Ahora debemos editaremos algunos archivos del tema donde queremos mostrar la paginación (index.php, categories.php or search.php) y ubiquemos el siguiente código:
<div class="navigation">
<div class="alignleft"><?php next_posts_link('Previous entries') ?></div>
<div class="alignright"><?php previous_posts_link('Next entries') ?></div>
</div>
Y remplacemoslo por este otro:
<?php
include('wp-pagenavi.php');
if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
?>
Guarda y actualiza tu blog, y no podrás notar cambio alguno 🙂
¿Qué paso? Como ves no estamos usado este plugin como tal, sino que usamos su código para hacer uso de sus funciones. Así que debemos modificar el archivo wp-pagenavi.php. Ubiquemos la función llamada wp_pagenavi(), y hagamos lo siguiente:
Vamos a llamar a una función que inicia todo el proceso:
pagenavi_init(); //llama a la funcion pagenavi_init()
Esa línea lo vamos a ubicar justo después de iniciarse la función wp_pagenavi, así:
function wp_pagenavi($before = '', $after = '') {
global $wpdb, $wp_query;
pagenavi_init(); //llama a la funcion pagenavi_init()
Ahora sí! actualiza tu blog y notarás este formato de paginación: Page 1 de 2 <<1,2>>
Sin embargo falta aplicarle algo de estilo visual. Puedes ayudarte del archivo de estilos que acompaña al plugin: pagenavi-css.css.
Simplemente tenemos que agregarlo en la cabecera de nuestro tema. Dentro de las etiquetas HTML <head></head>:
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/pagenavi-css.css" type="text/css" media="screen" />
Ahora si este estilo no te convence puedes usar otro, anteriormente hablamos de uno (Enlaces de páginas con estilo CSS) quizás te pueda servir.
Tip probado desde CatsWhoCode
Desesperado buscando un artículo que explicara esto medianamente bien, y por fin doy con el tuyo que es transparente de claro.
Thanks!
Hola Jesús
Recurro a tí en mi desesperación. No soy ni desarrollador, ni programador, ni se de código php o css. Solo tengo un blog y soluciono temas a base de foros. Tengo su subdominio con una plantilla que me es fantástica, perfecta. Es gratuita y me gusta como queda, pero como es gratuíta no tiene soporte.
El problema es que cuando pasa de la página 1 a la 2 pues aparece el mensaje 404. Estoy desesperado porque he cambiado permalinks e instalado el wp-pagenavi pero sigue igual.
Te pediría tu ayuda para solucionarlo. ¿Podrías?¿Qué necesitas que te muestre de código?
este es el link donde comprobarás lo que te digo:
http://www.biblioteca.divinoplacebo.com
Saludos y gracias por anticipado