5 fragmentos de código de paginación de WordPress con ejemplos [de simple a avanzado]
Publicado: 2020-02-03
Si está buscando el mejor código de paginación en WordPress con ejemplos específicos, encontrará que los ejemplos de fragmentos de código de paginación compartidos en esta publicación son muy útiles. Puede aplicar este código de paginación en el tema de WordPress o en un complemento personalizado de WordPress que requiere paginación de publicaciones. Permítanme cortar la persecución y compartir mis fragmentos de código de paginación favoritos:
#1) WordPress Loop con código de paginación simple
Si desea agregar paginación dentro del bucle de WordPress, puede usar el código de paginación siguiente y anterior a continuación:
<?php si ( have_posts() ) : ?>
<!-- Agregue las funciones de paginación aquí. -->
<!-- Inicio del bucle principal. -->
<?php while ( have_posts() ) : the_post(); ?>
<!-- el resto del bucle principal de tu tema -->
<?php mientras tanto; ?>
<!-- Fin del bucle principal -->
<!-- Agregue las funciones de paginación aquí. -->
<div class="nav-previous alignleft"><?php previous_posts_link('Anteriores'); ?></div>
<div class="nav-next alignright"><?php next_posts_link('Nuevas publicaciones'); ?></div>
<?php más: ?>
<p><?php _e('Lo siento, ninguna publicación coincide con sus criterios.'); ?></p>
<?php endif; ?>
#2) Paginación numérica de WordPress
Otra excelente opción de paginación de WordPress es usar la paginación numérica que agrega números a las publicaciones y agrupa las publicaciones en función de un número. Por ejemplo, puede mostrar 5 publicaciones en una página. Este es el código de paginación en WordPress para la paginación numérica :
<?php
#PASO 1: Crear la función de paginación numérica de WordPress
función njengah_numeric_pagination() {
si( es_singular() )
regreso;
global $wp_query;
/** Detener la ejecución si solo hay 1 página */
if( $wp_query->max_num_pages <= 1 )
regreso;
$paginado = get_query_var('paginado')? absent( get_query_var( 'paginado' ) ) : 1;
$max = intval( $wp_query->max_num_pages );
/** Agrega la página actual a la matriz */
if ( $paginado >= 1 )
$enlaces[] = $paginados;
/** Agrega las páginas alrededor de la página actual a la matriz */
if ( $paginado >= 3 ) {
$enlaces[] = $paginados - 1;
$enlaces[] = $paginados - 2;
}
if ( ( $paginado + 2 ) <= $max ) {
$enlaces[] = $paginados + 2;
$enlaces[] = $paginado + 1;
}
echo '<div class="navegación"><ul>' . "\norte";
/** Enlace de publicación anterior */
si ( get_anterior_posts_link() )
printf( '<li>%s</li>' . "\n", get_previous_posts_link() );
/** Enlace a la primera página, más puntos suspensivos si es necesario */
if ( ! in_array( 1, $enlaces ) ) {
$clase = 1 == $paginado? 'clase="activo"': '';
printf( '<li%s><a href="%s">%s</a></li>' . "\n", $clase, esc_url( get_pagenum_link( 1 ) ), '1' );
if ( ! in_array( 2, $enlaces ) )
eco '<li>…</li>';
}
/** Enlace a la página actual, más 2 páginas en cualquier dirección si es necesario */
ordenar ($ enlaces);
foreach ((matriz) $enlaces como $enlace) {
$clase = $paginado == $enlace ? 'clase="activo"': '';
printf( '<li%s><a href="%s">%s</a></li>' . "\n", $clase, esc_url( get_pagenum_link( $enlace ) ), $enlace );
}
/** Enlace a la última página, más puntos suspensivos si es necesario */
if ( ! in_array( $max, $enlaces ) ) {
if ( ! in_array( $max - 1, $enlaces ) )
eco '<li>…</li>' . "\norte";
$clase = $paginado == $max ? 'clase="activo"': '';
printf( '<li%s><a href="%s">%s</a></li>' . "\n", $clase, esc_url( get_pagenum_link( $max ) ), $max );
}
/** Enlace de publicación siguiente */
si ( get_next_posts_link() )
printf( '<li>%s</li>' . "\n", get_next_posts_link() );
eco '</ul></div>' . "\norte";
}
#PASO 2: agregue a las plantillas usando esta llamada a la función anterior
njengah_numeric_pagination();
#PASO 3: Diseña la Paginación apropiadamente para que se ajuste a los estilos de tu tema
/** Clases CSS para dar estilo a la paginación*/
.navegación li {
}
.navegación li a{
}
#3) Ejemplo de paginación de WordPress Ajax
Si está buscando el código de paginación Ajax en WordPress, encontré un ejemplo en GitHub que funciona muy bien y el código tiene la forma de un complemento. Lo he personalizado para convertirlo en un complemento para nuestro tutorial y el código se puede copiar en un archivo y guardar en formato zip e instalar como un complemento. El siguiente es el código de ejemplo de paginación de WordPress Ajax:
<?php
/**
* Nombre del complemento: Paginación Njengah Ajax
* URI del complemento: https://njengah.com
* Descripción: Ejemplo de paginación de WordPress Ajax.
* Versión: 1.0.0
* Autor: Joe Njenga
* Autor URI: https://njengah.com
* Licencia: GPL-2.0+
* URI de licencia: http://www.gnu.org/licenses/gpl-2.0.txt
* Dominio de texto: cs-paginación
* Ruta de dominio: /idiomas
*/
// Crédito - Casper Schultz
clase Njengah_Ajax_Pagination {
protegido $num_per_page;
función pública __construct() {
$this->num_per_page = 5;
$esto->init();
}
función protegida init() {
add_action( 'init', array( $this, 'add_rewrite_rule' ) );
add_filter( 'query_vars', array( $this, 'add_query_vars' ) );
add_action( 'parse_request', array( $this, 'parse_request' ) );
}
/**
* Analizar la solicitud entrante y generar el resultado.
*/
función parse_request ($wp) {
if ( array_key_exists( 'cs-page', $wp->query_vars ) ) {
$pagina = isset ( $wp->query_vars['cs-page'] ) ? $wp->query_vars['cs-page'] : 1;
$argumentos = matriz(
'post_type' => 'publicar',
'post_per_page' => $this->num_per_page,
'paginado' => $pagina,
);
$consulta = new WP_Query( $argumentos);
// Necesitamos saber el número total de publicaciones encontradas.
$valores['total'] = $consulta->publicaciones_encontradas;
// Y el por página.
$valores['per_page'] = $this->num_per_page;
$valores['publicaciones'] = array();
// Enviemos solo los datos que necesitamos.
while ( $consulta->have_posts() ) {
$consulta->the_post();
$valores['publicaciones'][] = matriz(
'ID' => get_the_ID(),
'título' => obtener_el_título(),
);
}
wp_reset_postdata();
wp_send_json ($ valores);
}
}
/**
* Agregue los argumentos de consulta necesarios.
*/
función agregar_consulta_vars ($consulta_vars) {
$query_vars[] = 'cs-page';
devolver $consulta_vars;
}
/**
* Agrega una regla de reescritura para nuestra paginación personalizada para que podamos evitar usar admin-ajax.
*/
función añadir_reescribir_regla() {
add_rewrite_rule( '^cs-paginate/([0-9]+)/?', 'index.php?cs-page=$matches[1]', 'top' );
}
/**
* Reglas de reescritura al ras.
*/
función estática instalar () {
flush_rewrite_rules();
}
}
función njengah_ajax_pagination_init() {
nuevo Njengah_Ajax_Pagination();
}
njengah_ajax_pagination_init();
// Necesidad de vaciar las reglas de reescritura en la activación.
register_activation_hook( __FILE__, array( 'Njengah_Ajax_Pagination', 'instalar' ) );
#4) Paginación de WordPress para tipos de publicaciones personalizadas
Para la paginación de tipo de publicación personalizada, debe usar WP_query para verificar el tipo de publicación personalizada y en los argumentos, pasa el tipo de publicación personalizada en post_type y luego usa el código de paginación para crear la paginación de WordPress para el tipo de publicación personalizada.
El siguiente es el código que debe agregar a functions.php y reemplazar post_type con su respectivo slug de tipo de publicación personalizado:
<?php
/**
* Paginación de WordPress para tipos de publicaciones personalizadas
*/
<?php
$paginado = ( get_query_var( 'paginado' ) ) ? get_query_var('paginado'): 1;
$argumentos = matriz(
'post_type' => 'custom_post_type_name',
'publicaciones_por_página' => 10,
'paginado' => $paginado
);
$ bucle = new WP_Query ($ argumentos);
while ( $loop->have_posts() ) : $loop->the_post();
// Contenido de tipo de publicación personalizado
mientras tanto;
?>
<clase de navegación="paginación">
<?php
$grande = 999999999;
echo paginar_enlaces( array(
'base' => str_replace( $grande, '%#%', get_pagenum_link( $grande ) ),
'formato' => '?paginado=%#%',
'actual' => max( 1, get_query_var('paginado') ),
'total' => $bucle->max_num_pages,
'prev_text' => '«',
'texto_siguiente' => '»
) );
?>
</nav>
<?php wp_reset_postdata(); ?>#5 WordPress de paginación de consulta personalizada
El código de paginación de consulta personalizada en WordPress utiliza WP_query para obtener la publicación específica que queremos paginar y luego combina los resultados de la consulta con el código de paginación para aplicar la paginación a las publicaciones específicas que seleccionamos. El siguiente es un ejemplo de paginación de consulta personalizada en WordPress.
<?php
//Consulta personalizada
$paginado = ( get_query_var( 'paginado' ) ) ? absent( get_query_var( 'paginado' ) ) : 1;
$argumentos = matriz(
'publicaciones_por_página' => 5,
'category_name' => 'galería',
'paginado' => $paginado,
);
$the_query = new WP_Query ($args);
?>
<!-- el bucle etc.. -->
<?php
// Paginación
$grande = 999999999; // necesita un número entero improbable
echo paginar_enlaces( array(
'base' => str_replace( $grande, '%#%', esc_url( get_pagenum_link( $grande ) ) ),
'formato' => '?paginado=%#%',
'actual' => max( 1, get_query_var('paginado') ),
'total' => $the_query->max_num_pages
) );Conclusión
En esta publicación, hemos resaltado los diferentes tipos de paginación de WordPress y el código de paginación específico compartido para usar en cada caso. Este código de paginación en WordPress se puede agregar a temas o complementos existentes y también se puede agregar a WordPress como un complemento independiente.