¿Está buscando una manera de crear paginación manual sin plugin? Si bien es probable que haya un plugin para esto, hemos creado un fragmento de código rápido que puede utilizar para crear una navegación de paginación clásica y controlar la salida de su contenido en WordPress.
Instrucciones:
Todo lo que tienes que hacer es añadir este código al archivo functions.php de tu tema o en un plugin específico del sitio:
function pagination($prev = '«', $next = '»') { global $wp_query, $wp_rewrite; $wp_query->query_vars['paged'] > 1 ? $current = $wp_query->query_vars['paged'] : $current = 1; $pagination = array( 'base' => @add_query_arg('paged','%#%'), 'format' => '', 'total' => $wp_query->max_num_pages, 'current' => $current, 'prev_text' => __($prev), 'next_text' => __($next), 'type' => 'plain' ); if( $wp_rewrite->using_permalinks() ) $pagination['base'] = user_trailingslashit( trailingslashit( remove_query_arg( 's', get_pagenum_link( 1 ) ) ) . 'page/%#%/', 'paged' ); if( !empty($wp_query->query_vars['s']) ) $pagination['add_args'] = array( 's' => get_query_var( 's' ) ); echo paginate_links( $pagination ); };
Opcionalmente, utilice este código para la matriz $pagination
para mostrar un aspecto diferente:
$pagination = array( 'base' => @add_query_arg('paged','%#%'), 'format' => '', 'total' => $wp_query->max_num_pages, 'current' => $current, 'prev_text' => __('« Previous'), 'next_text' => __('Next »'), 'end_size' => 1, 'mid_size' => 2, 'show_all' => true, 'type' => 'list' );
A continuación puedes añadir la paginación usando la función pagination(
). Puedes añadirla en algún lugar fuera del bucle, pero dentro de la sentencia if( have_post() )
de tu archivo de plantilla.
<?php if ( have_posts() ) : ?> <?php while ( have_posts() ) : the_post(); ?> // post goes here <?php endwhile; ?> <div class="pagination"><?php pagination('»', '«'); ?></div> <?php endif; ?>
WordPress también te permite añadir clases CSS personalizadas que puedes utilizar para gestionar el aspecto de tu nueva navegación. Vea este ejemplo CSS para averiguar cómo darle estilo:
.page-numbers { font-size: 15px; } .page-numbers.current { color: #222; } .page-numbers .dots { letter-spacing: 1px } a.page-numbers { font-size: 14px; color: #3888ff; }
Nota: Si es la primera vez que añade fragmentos de código en WordPress, consulte nuestra guía sobre cómo añadir correctamente fragmentos de código en WordPress, para no romper accidentalmente su sitio.
Si te ha gustado este fragmento de código, por favor considere revisar nuestros otros artículos en el sitio como: 43 mejores temas de fotografía para WordPress y cómo cambiar fácilmente de Squarespace a WordPress.
Comentarios Deja una respuesta