Cómo crear una paginación de WordPress para tipos de publicaciones personalizadas
Publicado: 2020-02-24
Crear paginación para tipos de publicaciones personalizadas no debería ser un desafío, ya que puede reutilizar la misma idea que usamos aquí: cómo crear una paginación de consulta personalizada en WordPress. Necesitamos consultar el tipo de publicación personalizada y luego mostrar las publicaciones de consultas que están en ese tipo de publicación o en varios tipos de publicación.
En esta publicación, le mostraré cómo crear una paginación de WordPress para los tipos de publicaciones personalizadas. La paginación será similar a esta paginación numérica. Crearemos una consulta personalizada que obtenga todos los tipos de publicaciones personalizadas y luego mostraremos los tipos de publicaciones personalizadas con el bucle y con la paginación de números.
Crear un tipo de publicación personalizada
El primer paso es crear un tipo de publicación personalizada usando el siguiente código:
/**
* Tipo de publicación personalizada - register_post_type()
* @description- Tutorial de Njengah Ejemplo de tipo de publicación personalizada
* @enlace -https://gist.github.com/Njengah/839466b773085ac2430772e081357cee
*
*/
add_action('init', "njengah_tutorial_cpt");
función njengah_tutorial_cpt(){
$etiquetas = matriz(
'nombre' => _x('Tutoriales', 'nombre general del tipo de publicación'),
'singular_name' => _x('Tutorial', 'post type singular name'),
'menu_name' => _x('Tutoriales', 'menú de administración'),
'name_admin_bar' => _x('Tutorial', 'agregar nuevo en la barra de administración'),
'agregar_nuevo' => _x('Agregar nuevo', ''),
'add_new_item' => __('Agregar nuevo tutorial'),
'edit_item' => __('Editar tutorial'),
'nuevo_elemento' => __('Nuevo Tutorial'),
'all_items' => __('Todo el tutorial'),
'ver_elemento' => __('Ver Tutorial'),
'search_items' => __('Buscar tutoriales'),
'not_found' => __('No se encontraron tutoriales'),
'not_found_in_trash' => __('No se encontraron tutoriales en la papelera'),
'parent_item_colon' => __('Tutoriales para padres:'),
);
$argumentos = matriz(
'jerárquico' => verdadero,
'etiquetas' => $etiquetas,
'público' => verdadero,
'publicly_queryable' => verdadero,
'descripción' => __('Descripción.'),
'show_ui' => verdadero,
'show_in_menu' => verdadero,
'show_in_nav_menus' => verdadero,
'query_var' => verdadero,
'reescribir' => verdadero,
'query_var' => verdadero,
'reescribir' => array('slug' => 'tutorial'),
'capability_type' => 'página',
'has_archive' => verdadero,
'posición_menú' => 22,
"show_in_rest" => verdadero,
'soporta' => array( 'título', 'editor', 'autor', 'miniatura', 'comentarios', 'revisiones', 'atributos de página', 'campos personalizados')
);
register_post_type('tutorial', $argumentos);
}Agregue este código a su archivo functions.php y verá que el tipo de publicación personalizada ' Tutoriales' aparece en su tablero de WordPress.
Este código se puede cambiar para adaptarse a su tipo de publicación personalizada específica. El tipo de publicación personalizada también se puede crear utilizando los complementos de generación de tipo de publicación personalizada.
Crear una plantilla de página para mostrar tipos de publicaciones personalizadas
Necesitamos crear una plantilla de página personalizada que se usará para mostrar los tipos de publicaciones personalizadas usando el bucle de WordPress.
Para crear una plantilla de página personalizada, debe crear un nuevo archivo en la carpeta raíz de su tema.
Asigne un nombre al archivo: custom -page.php o cualquier otro nombre que sea descriptivo del tipo de publicación personalizada, por ejemplo, para el tipo de publicación personalizada creado arriba, el nombre podría ser tutoriales-page.php.
En este archivo, agregue el encabezado de la plantilla de página personalizada usando el siguiente código y guarde los cambios:
<?php /** * Nombre de la plantilla: Plantilla de tutoriales */ obtener_encabezado();
Ahora debería ver que la plantilla de página personalizada está visible en la opción de plantilla de atributos de su página, como se muestra a continuación:
Crear consulta personalizada de tipo de publicación personalizada
La consulta personalizada es el primer paso que nos permitirá consultar los tipos de publicaciones personalizadas existentes y mostrarlas en la plantilla de página personalizada que creamos en el paso anterior.
El siguiente es el código que consultará el tipo de publicación personalizada de tutoriales y recuperará las dos primeras publicaciones y luego las mostrará en la plantilla de página personalizada que creamos anteriormente.
<?php
/**
* Nombre de la plantilla: Plantilla de tutoriales
*/
obtener_encabezado();
// Paso 1: Crear consulta personalizada
$paginado = ( get_query_var( 'paginado' ) ) ? get_query_var('paginado'): 1;
$argumentos = matriz(
'posts_per_page' => 2, // consulta las últimas 2 publicaciones
'post_type' => 'tutorial',
'paginado' => $paginado
);
$customPostQuery = new WP_Query($args);
?>Mostrar publicaciones personalizadas de tutoriales en la plantilla de página personalizada
El siguiente es el código que consultará el tipo de mensaje personalizado y lo mostrará en la plantilla de página personalizada:
<?php
/**
* Nombre de la plantilla: Plantilla de tutoriales
*/
obtener_encabezado();
// Paso 1: Crear consulta personalizada
$paginado = ( get_query_var( 'paginado' ) ) ? get_query_var('paginado'): 1;
$argumentos = matriz(
'posts_per_page' => 2, // consulta las últimas 2 publicaciones
'post_type' => 'tutorial',
'paginado' => $paginado
);
$customPostQuery = new WP_Query($args);
?>
<!-- Paso 2: mostrar las publicaciones que consultamos en el paso 1 -->
<div clase="envolver">
<div id="primaria" clase="área de contenido">
<id principal="principal" clase="sitio-principal" rol="principal">
<?php
if($customPostQuery->have_posts() ):
while($customPostQuery->have_posts()) :
$customPostQuery->the_post();
publicación global $;
?>
<div class ="envoltura-de-contenido-interno">
<ul class ="cq-posts-list">
<li>
<h3 class ="cq-h3"><a href="<?php the_permalink(); ?>" ><?php the_title(); ?></a></h3>
<div>
<ul>
<div>
<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('miniatura'); ?></a>
</div>
</ul>
<ul>
<p><?php echo el_contenido(); ?></p>
</ul>
</div>
</li>
</ul>
</div> <!-- finalizar las publicaciones del blog -->
<?php mientras tanto;
terminara si;
wp_reset_query();Crear función de paginación de publicación personalizada de WordPress
En este paso, ahora debemos crear una función de paginación de tipo de publicación personalizada que se agregará a las funciones del tema y se llamará después de que el ciclo muestre los tipos de publicación personalizados.
El siguiente código debe agregarse a functions.php para crear una función de paginación de tipo de publicación personalizada.
// Función de paginación de tipo de publicación personalizada
función cpt_pagination($páginas = '', $rango = 4)
{
$mostrarelementos = ($rango * 2)+1;
global $paginado;
if(vacío($paginado)) $paginado = 1;
si ($ páginas == '')
{
global $wp_query;
$páginas = $wp_query->max_num_pages;
si(!$páginas)
{
$páginas = 1;
}
}
if(1 != $páginas)
{
echo "<nav aria-label='Ejemplo de navegación de página'> <ul class='pagination'> <span>Página ".$paged." de ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>« Primero</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>‹ Anterior</a>";
para ($i=1; $i <= $páginas; $i++)
{
if (1 != $páginas &&( !($i >= $paginado+$rango+1 || $i <= $paginado-$rango-1) || $páginas <= $mostrarelementos ))
{
echo ($paginado == $i)? "<li class=\"elemento de página activo\"><a class='enlace de página'>".$i."</a></li>":"<li class='elemento de página' > <a href='".get_pagenum_link($i)."' class=\"page-link\">".$i."</a></li>";
}
}
if ($paged < $pages && $showitems < $pages) echo " <li class='page-item'><a class='page-link' href=\"".get_pagenum_link($paged + 1)". \">i class='flaticon flaticon-back'></i></a></li>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo " <li class='page-item'><a class='page-link' href=' ".get_pagenum_link($páginas)."'><i class='flaticon flaticon-arrow'></i></a></li>";
echo "</ul></nav>\n";
}
}Llame a la función de paginación de tipo de publicación personalizada en la plantilla de página
Dado que hemos creado la función de paginación de tipo de publicación personalizada y ya hemos ejecutado el bucle y mostrado los tipos de publicación personalizados, ahora debemos agregar la función de paginación en la parte inferior de la plantilla de página personalizada para que podamos mostrar la paginación.
El siguiente es el código que debe usarse para verificar si existe la función de paginación de publicación personalizada y, si existe, debemos llamarla para mostrar la paginación.
// Paso 3: llame a la función de paginación aquí
si (función_existe("cpt_paginación")) {
cpt_pagination($customPostQuery->max_num_pages);
}Hemos creado un tipo de publicación personalizada, una plantilla de página personalizada, hemos agregado una función de paginación de tipo de publicación personalizada y mostramos tanto los tipos de publicación personalizados con una consulta como la función de paginación de tipo de publicación personalizada.
Estilos de paginación de tipo de publicación personalizada
Debe agregar los estilos a la paginación de tipo de publicación personalizada utilizando el siguiente código:
/**
* Estilos de paginación de tipo de publicación personalizados
* @autor Joe Njenga
*/
.paginación {
Limpia los dos;
posición: relativa;
tamaño de fuente: 16px;
altura de línea: 13px;
flotar derecho;
tipo-estilo-lista:ninguno;
ancho: 100%
}
.intervalo de paginación, .paginación a {
bloqueo de pantalla;
flotador izquierdo;
margen: 2px 2px 2px 0;
relleno:6px 9px 5px 9px;
texto-decoración: ninguno;
ancho: automático;
color:#fff;
fondo: #237697;
}
.paginación a: hover{
color:#fff;
fondo: #000;
}
.paginación .actual{
relleno:6px 9px 5px 9px;
fondo: #999;
color:#fff;Estamos listos para ver el resultado de este código. Para ver la paginación del tipo de publicación personalizada, debe crear una nueva página con la plantilla de página personalizada que creamos en el segundo paso.
Después de crear esta página, debería ver que la página muestra el tipo de publicación personalizada que consultamos y la paginación que creamos como se muestra en la imagen a continuación:
Pensamientos finales
Para crear una paginación de tipo de publicación personalizada, debe crear la plantilla de página personalizada, agregar la consulta personalizada para obtener todas las publicaciones personalizadas que desea mostrar y llamar a la función de paginación personalizada que agrega a functions.php. Para obtener este código completo, lo he agregado al repositorio de git y puede acceder a él aquí: Paginación de tipo de publicación personalizada de WordPress.