Jak utworzyć paginację WordPress dla niestandardowych typów postów
Opublikowany: 2020-02-24
Tworzenie paginacji dla niestandardowych typów postów nie powinno być wyzwaniem, ponieważ możesz wykorzystać ten sam pomysł, którego użyliśmy tutaj – jak utworzyć niestandardową paginację zapytań w WordPress. Musimy zapytać o niestandardowy typ postu, a następnie wyświetlić posty z zapytaniami, które są w tym typie postu lub w kilku typach postów.
W tym poście pokażę, jak stworzyć paginację WordPress dla niestandardowych typów postów. Paginacja będzie podobna do tej numerycznej. Stworzymy niestandardowe zapytanie, które pobierze wszystkie niestandardowe typy postów, a następnie wyświetli niestandardowe typy postów za pomocą pętli i stronicowania numerów.
Utwórz niestandardowy typ posta
Pierwszym krokiem jest utworzenie niestandardowego typu posta przy użyciu następującego kodu:
/**
* Niestandardowy typ posta - register_post_type()
* @description- Njengah Tutorial Przykład niestandardowego typu posta
* @link -https://gist.github.com/Njengah/839466b773085ac2430772e081357cee
*
*/
add_action('init', "njengah_tutorial_cpt");
funkcja njengah_tutorial_cpt(){
$etykiety = tablica(
'name' => _x('Samouczki', 'nazwa ogólna typu posta'),
'singular_name' => _x('Tutorial', 'typ posta w liczbie pojedynczej'),
'menu_name' => _x('Samouczki', 'menu administratora'),
'name_admin_bar' => _x('Tutorial', 'dodaj nowy na pasku administracyjnym'),
'add_new' => _x('Dodaj nowy', ''),
'add_new_item' => __('Dodaj nowy samouczek'),
'edit_item' => __('Edytuj samouczek'),
'new_item' => __('Nowy samouczek'),
'all_items' => __('Wszystkie samouczki'),
'view_item' => __('Wyświetl samouczek'),
'search_items' => __('Poradniki wyszukiwania'),
'not_found' => __('Nie znaleziono samouczków'),
'not_found_in_trash' => __('Nie znaleziono samouczków w Koszu'),
'parent_item_colon' => __('Samouczki dla rodziców:'),
);
$argumenty = tablica(
'hierarchiczny' => prawda,
'etykiety' => $etykiety,
'publiczny' => prawda,
'publicly_queryable' => prawda,
'opis' => __('Opis.'),
'show_ui' => prawda,
'show_in_menu' => prawda,
'show_in_nav_menus' => prawda,
'query_var' => prawda,
'przepisz' => prawda,
'query_var' => prawda,
'rewrite' => array('slug' => 'tutorial'),
'capability_type' => 'strona',
'has_archive' => prawda,
'pozycja_menu' => 22,
"show_in_rest" => prawda,
'obsługuje' => array( 'tytuł', 'redaktor', 'autor', 'miniaturka', 'komentarze', 'poprawki', 'atrybuty-stron', 'niestandardowe-pola' )
);
register_post_type('samouczek', $args);
}Dodaj ten kod do pliku functions.php, a zobaczysz niestandardowy typ wpisu „ Samouczki” pojawi się na pulpicie WordPress.
Ten kod można zmienić, aby dopasować go do konkretnego niestandardowego typu postu. Niestandardowy typ posta można również utworzyć za pomocą wtyczek do generowania niestandardowych typów postów.
Utwórz szablon strony, aby wyświetlić niestandardowe typy postów
Musimy stworzyć niestandardowy szablon strony, który będzie używany do wyświetlania niestandardowych typów postów za pomocą pętli WordPress.
Aby utworzyć niestandardowy szablon strony, powinieneś utworzyć nowy plik w głównym folderze swojego motywu.
Nazwij plik - custom -page.php lub dowolna inna nazwa opisująca niestandardowy typ postu, na przykład niestandardowy typ posta utworzony powyżej nazwy może być tutorials-page.php.
W tym pliku dodaj nagłówek niestandardowego szablonu strony używając poniższego kodu i zapisz zmiany:
<?php /** * Nazwa szablonu: Szablon samouczków */ pobierz_nagłówek();
Powinieneś teraz zobaczyć, że niestandardowy szablon strony jest widoczny w opcji szablonu atrybutów strony, jak pokazano poniżej:
Utwórz niestandardowe zapytanie typu posta
Zapytanie niestandardowe to pierwszy krok, który pozwoli nam zbadać istniejące niestandardowe typy postów i wyświetlić je w niestandardowym szablonie strony, który utworzyliśmy w poprzednim kroku.
Poniżej znajduje się kod, który wyśle zapytanie do niestandardowego typu postu samouczków i pobierze pierwsze dwa posty, a następnie wyświetli je w niestandardowym szablonie strony, który utworzyliśmy powyżej.
<?php
/**
* Nazwa szablonu: Szablon samouczków
*/
pobierz_nagłówek();
// Krok 1: Utwórz zapytanie niestandardowe
$paged = ( get_query_var( 'stronicowane' ) ) ? get_query_var( 'stronicowane' ) : 1;
$argumenty = tablica(
'posts_per_page' => 2,// zapytanie o ostatnie 2 posty
'post_type' => 'samouczek',
'stronicowany' => $stronicowany
);
$customPostQuery = nowe WP_Query($args);
?>Wyświetlaj niestandardowe posty samouczka w niestandardowym szablonie strony
Poniżej znajduje się kod, który wyśle zapytanie o niestandardowy typ posta i wyświetli go w niestandardowym szablonie strony:
<?php
/**
* Nazwa szablonu: Szablon samouczków
*/
pobierz_nagłówek();
// Krok 1: Utwórz zapytanie niestandardowe
$paged = ( get_query_var( 'stronicowane' ) ) ? get_query_var( 'stronicowane' ) : 1;
$argumenty = tablica(
'posts_per_page' => 2,// zapytanie o ostatnie 2 posty
'post_type' => 'samouczek',
'stronicowany' => $stronicowany
);
$customPostQuery = nowe WP_Query($args);
?>
<!-- Krok 2: Wyświetl posty, o które zapytaliśmy w kroku 1 -->
<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();
globalny $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> <!-- koniec postów na blogu -->
<?php koniec;
endif;
wp_reset_query();Utwórz niestandardową funkcję stronicowania postów WordPress
W tym kroku powinniśmy teraz utworzyć niestandardową funkcję stronicowania typu postów, która zostanie dodana do funkcji motywu i zostanie wywołana po tym, jak pętla wyświetli niestandardowe typy postów.
Poniższy kod powinien zostać dodany do functions.php, aby utworzyć niestandardową funkcję stronicowania typu post.
// Niestandardowa funkcja stronicowania typu post
funkcja cpt_pagination($strony = '', $zakres = 4)
{
$showitems = ($zakres * 2)+1;
globalna $paged;
if(pusty($stronicowany)) $stronicowany = 1;
if($strony == '')
{
globalne $wp_query;
$pages = $wp_query->max_num_pages;
if(!$strony)
{
$strony = 1;
}
}
if(1 != $strony)
{
echo "<nav aria-label='Przykład nawigacji strony'> <ul class='pagination'> <span>Strona ".$paged." z ".$pages."</span>";
if($paged > 2 && $paged > $zakres+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)."'>‹ Poprzedni</a>";
dla ($i=1; $i <= $stron; $i++)
{
if (1 != $strony &&( !($i >= $stronicowane+$zakres+1 || $i <= $stronicowane-$zakres-1) || $strony <= $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($pages)."'><i class='flaticon flaticon-arrow'></i></a></li>";
echo "</ul></nav>\n";
}
}Wywołaj funkcję stronicowania niestandardowego typu postu w szablonie strony
Ponieważ utworzyliśmy funkcję paginacji typu niestandardowego posta i już uruchomiliśmy pętlę i wyświetliliśmy niestandardowe typy postów, musimy teraz dodać funkcję paginacji na dole szablonu strony niestandardowej, aby wyświetlić paginację.
Poniżej znajduje się kod, który powinien zostać użyty do sprawdzenia, czy niestandardowa funkcja stronicowania posta istnieje, a jeśli tak, powinniśmy ją wywołać, aby wyświetlić stronicowanie
// Krok 3: Wywołaj tutaj funkcję stronicowania
if (function_exists("cpt_pagination")) {
cpt_pagination($customPostQuery->max_num_pages);
}Stworzyliśmy niestandardowy typ postu, niestandardowy szablon strony, dodaliśmy funkcję paginacji niestandardowego typu postu i wyświetliliśmy zarówno niestandardowe typy postów z zapytaniem, jak i funkcję stronicowania niestandardowego typu postów.
Niestandardowe style paginacji typu post
Musisz dodać style do niestandardowej paginacji typu postu za pomocą następującego kodu:
/**
* Niestandardowe style paginacji typu post
* @autor Joe Njenga
*/
paginacja {
oba czyste;
pozycja:względna;
rozmiar czcionki:16px;
wysokość linii:13px;
pływak:w prawo;
typ-listy:brak;
szerokość:100%
}
.pagination rozpiętość, .pagination a {
Blok wyświetlacza;
pływak:w lewo;
margines: 2px 2px 2px 0;
wypełnienie: 6px 9px 5px 9px;
dekoracja tekstu:brak;
szerokość:auto;
kolor:#fff;
tło: #237697;
}
.paginacja a: najechanie {
kolor:#fff;
tło: #000;
}
.paginacja .bieżąca{
wypełnienie: 6px 9px 5px 9px;
tło: #999;
kolor:#fff;Jesteśmy gotowi do obejrzenia wyniku tego kodu. Aby wyświetlić niestandardową paginację typu posta, musisz utworzyć nową stronę z niestandardowym szablonem strony, który stworzyliśmy w drugim kroku.
Po utworzeniu tej strony powinieneś zobaczyć, że strona wyświetla niestandardowy typ posta, który zapytaliśmy, oraz utworzoną przez nas paginację, jak pokazano na poniższym obrazku:
Końcowe przemyślenia
Aby utworzyć niestandardową paginację typu posta, musisz utworzyć niestandardowy szablon strony, dodać niestandardowe zapytanie, aby uzyskać wszystkie niestandardowe posty, które chcesz wyświetlić, i wywołać niestandardową funkcję paginacji, którą dodajesz do functions.php. Aby uzyskać ten pełny kod, dodałem go do repozytorium git i możesz uzyskać do niego dostęp tutaj – WordPress Custom Post Type Pagination.