Делаем пагинацию страниц на WordPress

Для начала установим плагин WP-PageNavi и сделаем основные настройки отображения пагинации.

Далее в файл function.php добавим строки для замены стандартной пагинации WordPress.

function.php

/**
 * Заменяем стандартную пагинацию WooCommerce на постраничную  навигацию WP-PageNavi
 *
 */
remove_action('woocommerce_pagination', 'woocommerce_pagination', 10);
function woocommerce_pagination() {
		wp_pagenavi(); 		
	}
add_action( 'woocommerce_pagination', 'woocommerce_pagination', 10);

После этого, делаем шаблон страницы для отзывов - Шаблон страницы «Страница отзывов» (template-feedbackpage.php).

template-feedbackpage.php

<?php
/**
 * Template name: Страница отзывов
 */

get_header();
?>





	<div class="container-page-001 overlay-black">
		<div class="container-page-001-content">
			<div class="container-page-001__title">
				<p class="container-page-001__title-maintxt"><?php echo get_the_title() ?></p>
				<?$under_title = get_field('under_title');?>
				<p class="container-page-001__title-txt"><?=$under_title;?></p>
			</div>
			<div class="container-page-001__breadcrumbs">
				<?php if( function_exists('kama_breadcrumbs') ) kama_breadcrumbs(' / '); ?>
			</div>
		</div>
	</div>





	<div class="container-page-002">
		<div class="container-page-002-content">
			
			<?
			$query_news = new WP_Query(
				array(
					'post_type' => 'post',
					'posts_per_page' => 1,
					'paged' => get_query_var('paged')
				)
			);
			
			if ( $query_news->have_posts() ) {
				while ( $query_news->have_posts() ) {
					$query_news->the_post();
			?>
			
			<h2><?php the_title(); ?></h2>
			<p class="container-page-005__items-text-txt"><?php the_content(); ?></p>
			
			<?
			}}
			?>
			
			<div class="page-navigation" style="display: flex; flex-direction: column; align-items: center;">
				<p class="page-navigation__maintext">Страница</p>
				<?php wp_pagenavi( array( 'query' => $query_news ) ); ?>
			</div>
								
			<?wp_reset_query();?>
			
		</div>
	</div>





<?php
get_footer();

 Как раз на нем и будет работать наша пагинация.

Создаем несколько записей, постов с любым содержание для проверки.

Создаем страницу "Отзывы" и прицепляем к ней этот шаблон. Проверяем работу пагинации.

Базовый настройки плагина

Пример стилей для пагинации.

CSS

/*Пагинация*/
.wp-pagenavi {
	margin: 10px 0 0 0;
	display: flex;
	justify-content: center;}
.wp-pagenavi a, .wp-pagenavi span {
    text-decoration: none;
    border: 2px solid #a2000d;
    padding: 3px 13px;
    margin: 2px;
    border-radius: 5px;
	color: #000000;}

Ajax Пагинация отдельного блока на главной странице сайта

Эту шпаргалку можно посмотреть здесь.