So erstellen Sie eine WordPress-Paginierung für benutzerdefinierte Beitragstypen
Veröffentlicht: 2020-02-24
Das Erstellen einer Paginierung für benutzerdefinierte Beitragstypen sollte keine Herausforderung sein, da Sie die gleiche Idee, die wir hier verwendet haben, wiederverwenden können – wie man eine benutzerdefinierte Paginierung für Abfragen in WordPress erstellt. Wir müssen den benutzerdefinierten Beitragstyp abfragen und dann die abgefragten Beiträge anzeigen, die in diesem Beitragstyp oder in mehreren Beitragstypen enthalten sind.
In diesem Beitrag zeige ich Ihnen, wie Sie WordPress-Paginierungen für die benutzerdefinierten Beitragstypen erstellen. Die Paginierung ähnelt dieser numerischen Paginierung. Wir werden eine benutzerdefinierte Abfrage erstellen, die alle benutzerdefinierten Post-Typen abruft und dann die benutzerdefinierten Post-Typen mit der Schleife und mit Zahlenpaginierung anzeigt.
Erstellen Sie einen benutzerdefinierten Beitragstyp
Der erste Schritt besteht darin , einen benutzerdefinierten Beitragstyp mit dem folgenden Code zu erstellen :
/**
* Benutzerdefinierter Beitragstyp - register_post_type()
* @description- Njengah Tutorial Custom Post Type Beispiel
* @link -https://gist.github.com/Njengah/839466b773085ac2430772e081357cee
*
*/
add_action('init', "njengah_tutorial_cpt");
Funktion njengah_tutorial_cpt(){
$labels = array(
'name' => _x('Tutorials', 'allgemeiner Name des Beitragstyps'),
'singular_name' => _x('Tutorial', 'post type singular name'),
'menu_name' => _x('Tutorials', 'Admin-Menü'),
'name_admin_bar' => _x('Tutorial', 'Neues in der Admin-Leiste hinzufügen'),
'add_new' => _x('Neu hinzufügen', ''),
'add_new_item' => __('Neues Tutorial hinzufügen'),
'edit_item' => __('Tutorial bearbeiten'),
'new_item' => __('Neues Tutorial'),
'all_items' => __('Alle Tutorials'),
'view_item' => __('Tutorial ansehen'),
'search_items' => __('Tutorials durchsuchen'),
'not_found' => __('Keine Tutorials gefunden'),
'not_found_in_trash' => __('Keine Tutorials im Papierkorb gefunden'),
'parent_item_colon' => __('Eltern-Tutorials:'),
);
$args = array(
'hierarchical' => wahr,
'labels' => $labels,
'öffentlich' => wahr,
'publicly_queryable' => wahr,
'Beschreibung' => __('Beschreibung.'),
'show_ui' => wahr,
'show_in_menu' => wahr,
'show_in_nav_menus' => wahr,
'query_var' => wahr,
'umschreiben' => wahr,
'query_var' => wahr,
'rewrite' => array('slug' => 'tutorial'),
'capability_type' => 'Seite',
'has_archive' => wahr,
'menu_position' => 22,
"show_in_rest" => wahr,
'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'comments', 'revisions', 'page-attributes', 'custom-fields' )
);
register_post_type('tutorial', $args);
}Fügen Sie diesen Code zu Ihrer functions.php-Datei hinzu und Sie werden sehen, dass der benutzerdefinierte Beitragstyp „ Tutorials“ auf Ihrem WordPress-Dashboard erscheint.
Dieser Code kann an Ihren spezifischen benutzerdefinierten Beitragstyp angepasst werden. Der benutzerdefinierte Beitragstyp kann auch mit den Plugins zur Generierung benutzerdefinierter Beitragstypen erstellt werden.
Erstellen Sie eine Seitenvorlage, um benutzerdefinierte Beitragstypen anzuzeigen
Wir müssen eine benutzerdefinierte Seitenvorlage erstellen, die verwendet wird, um die benutzerdefinierten Beitragstypen mithilfe der WordPress-Schleife anzuzeigen.
Um eine benutzerdefinierte Seitenvorlage zu erstellen, sollten Sie eine neue Datei im Stammordner Ihres Designs erstellen.
Benennen Sie die Datei – custom -page.php oder einen anderen Namen, der den benutzerdefinierten Beitragstyp beschreibt, zum Beispiel könnte der Name für den oben erstellten benutzerdefinierten Beitragstyp tutorials-page.php lauten.
Fügen Sie in dieser Datei die Kopfzeile der benutzerdefinierten Seitenvorlage mit dem folgenden Code hinzu und speichern Sie die Änderungen:
<?php /** * Vorlagenname: Lernprogrammvorlage */ get_header();
Sie sollten nun sehen, dass die benutzerdefinierte Seitenvorlage in Ihrer Vorlagenoption für Seitenattribute sichtbar ist, wie unten gezeigt:
Erstellen Sie eine benutzerdefinierte Abfrage vom Beitragstyp
Die benutzerdefinierte Abfrage ist der erste Schritt, der es uns ermöglicht, die vorhandenen benutzerdefinierten Beitragstypen abzufragen und sie auf der benutzerdefinierten Seitenvorlage anzuzeigen, die wir im vorherigen Schritt erstellt haben.
Das Folgende ist der Code, der den benutzerdefinierten Beitragstyp der Tutorials abfragt und die ersten beiden Beiträge abruft und sie dann in der benutzerdefinierten Seitenvorlage anzeigt, die wir oben erstellt haben.
<?php
/**
* Vorlagenname: Lernprogrammvorlage
*/
get_header();
// Schritt 1: Benutzerdefinierte Abfrage erstellen
$paged = ( get_query_var( 'paged' ) ) ? get_query_var('ausgelagert'): 1;
$args = array(
'posts_per_page' => 2,// Abfrage der letzten 2 Beiträge
'post_type' => 'Anleitung',
'paged' => $paged
);
$customPostQuery = neue WP_Query($args);
?>Zeigen Sie benutzerdefinierte Tutorial-Beiträge in der benutzerdefinierten Seitenvorlage an
Das Folgende ist der Code, der den benutzerdefinierten Beitragstyp abfragt und in der benutzerdefinierten Seitenvorlage anzeigt:
<?php
/**
* Vorlagenname: Lernprogrammvorlage
*/
get_header();
// Schritt 1: Benutzerdefinierte Abfrage erstellen
$paged = ( get_query_var( 'paged' ) ) ? get_query_var('ausgelagert'): 1;
$args = array(
'posts_per_page' => 2,// Abfrage der letzten 2 Beiträge
'post_type' => 'Anleitung',
'paged' => $paged
);
$customPostQuery = neue WP_Query($args);
?>
<!-- Schritt 2: Zeigen Sie die Beiträge an, die wir in Schritt 1 abgefragt haben -->
<div class="wrap">
<div id="primary" class="content-area">
<main id="main" class="site-main" role="main">
<?php
if($customPostQuery->have_posts() ):
while($customPostQuery->have_posts()) :
$customPostQuery->the_post();
globaler $post;
?>
<div class ="inner-content-wrap">
<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('thumbnail'); ?></a>
</div>
</ul>
<ul>
<p><?php echo the_content(); ?></p>
</ul>
</div>
</li>
</ul>
</div> <!-- Blogbeiträge beenden -->
<?php endwhile;
endif;
wp_reset_query();Erstellen Sie eine benutzerdefinierte WordPress-Post-Paginierungsfunktion
In diesem Schritt sollten wir nun eine benutzerdefinierte Paginierungsfunktion für Beitragstypen erstellen, die zu den Themenfunktionen hinzugefügt und aufgerufen wird, nachdem die Schleife die benutzerdefinierten Beitragstypen anzeigt.
Der folgende Code sollte zur functions.php hinzugefügt werden, um eine benutzerdefinierte Paginierungsfunktion für den Beitragstyp zu erstellen.
// Paginierungsfunktion des benutzerdefinierten Beitragstyps
Funktion cpt_pagination($pages = '', $range = 4)
{
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($seiten == '')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$seiten)
{
$seiten = 1;
}
}
if(1 != $seiten)
{
echo "<nav aria-label='Seitennavigationsbeispiel'> <ul class='pagination'> <span>Seite ".$paged." von ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>« First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>‹ Zurück</a>";
for ($i=1; $i <= $pages; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
{
echo ($paged == $i)? "<li class=\"page-item active\"><a class='page-link'>".$i."</a></li>":"<li class='page-item' > <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($seiten)."'><i class='flaticon flaticon-arrow'></i></a></li>";
echo "</ul></nav>\n";
}
}Rufen Sie die Paginierungsfunktion für benutzerdefinierte Beitragstypen in der Seitenvorlage auf
Da wir die Paginierungsfunktion für benutzerdefinierte Beitragstypen erstellt und die Schleife bereits ausgeführt und die benutzerdefinierten Beitragstypen angezeigt haben, müssen wir nun die Paginierungsfunktion am unteren Rand der benutzerdefinierten Seitenvorlage hinzufügen, damit wir die Paginierung anzeigen.
Das Folgende ist der Code, der verwendet werden sollte, um zu überprüfen, ob die benutzerdefinierte Post-Paginierungsfunktion vorhanden ist, und wenn dies der Fall ist, sollten wir sie aufrufen, um die Paginierung anzuzeigen
// Schritt 3: Rufen Sie hier die Paginierungsfunktion auf
if (function_exists("cpt_pagination")) {
cpt_pagination($customPostQuery->max_num_pages);
}Wir haben einen benutzerdefinierten Beitragstyp, eine benutzerdefinierte Seitenvorlage, eine benutzerdefinierte Paginierungsfunktion für Beitragstypen hinzugefügt und sowohl die benutzerdefinierten Beitragstypen mit einer Abfrage als auch die Paginierungsfunktion für benutzerdefinierte Beitragstypen angezeigt.
Benutzerdefinierte Paginierungsstile für Beitragstypen
Sie müssen die Stile mit dem folgenden Code zur Paginierung des benutzerdefinierten Beitragstyps hinzufügen:
/**
* Benutzerdefinierte Paginierungsstile für Beitragstypen
* @Autor Joe Njenga
*/
.Seitennummerierung {
Lösche beide;
Position: relativ;
Schriftgröße: 16px;
Zeilenhöhe: 13px;
schweben rechts;
list-style-type:none;
Breite: 100 %
}
.pagination span, .pagination a {
Bildschirmsperre;
Schwimmer: links;
Rand: 2px 2px 2px 0;
Polsterung:6px 9px 5px 9px;
Textdekoration: keine;
Breite: automatisch;
Farbe:#fff;
Hintergrund: #237697;
}
.paginieren a:hover{
Farbe:#fff;
Hintergrund: #000;
}
.paginierung .aktuell{
Polsterung:6px 9px 5px 9px;
Hintergrund: #999;
Farbe:#fff;Wir sind bereit, das Ergebnis dieses Codes anzuzeigen. Um die Paginierung des benutzerdefinierten Beitragstyps anzuzeigen, müssen Sie eine neue Seite mit der benutzerdefinierten Seitenvorlage erstellen, die wir im zweiten Schritt erstellt haben.
Nachdem Sie diese Seite erstellt haben, sollten Sie sehen, dass die Seite den von uns abgefragten benutzerdefinierten Beitragstyp und die von uns erstellte Paginierung anzeigt, wie in der Abbildung unten gezeigt:
Abschließende Gedanken
Um eine benutzerdefinierte Seitennummerierung zu erstellen, müssen Sie die benutzerdefinierte Seitenvorlage erstellen, die benutzerdefinierte Abfrage hinzufügen, um alle benutzerdefinierten Beiträge abzurufen, die Sie anzeigen möchten, und die benutzerdefinierte Paginierungsfunktion aufrufen, die Sie der functions.php hinzufügen. Um diesen vollständigen Code zu erhalten, habe ich ihn dem Git-Repo hinzugefügt und Sie können hier darauf zugreifen – WordPress Custom Post Type Pagination.