Как создать динамическую пагинацию в WordPress без плагинов

Автор: Ярослав Смирнов | Опубликовано: 29.01.2026

Пагинация — это важный элемент навигации на сайте, особенно если у вас много записей, товаров или других типов контента. В стандартной теме WordPress обычно есть базовая пагинация, но она часто не подходит для сложных проектов, где требуется гибкое управление страницами и отображением ссылок. В этой статье мы подробно разберём, как создать динамическую пагинацию в WordPress без использования плагинов, используя только встроенные средства и немного PHP-кода.

Почему стоит делать пагинацию самостоятельно?

Большинство плагинов для пагинации добавляют лишний код и замедляют сайт. Кроме того, они могут не соответствовать дизайну вашего сайта или иметь ограниченные возможности кастомизации. Создавая пагинацию самостоятельно, вы получаете полный контроль над выводом и поведением навигации, что особенно важно для технически сложных проектов.

К тому же, собственная реализация пагинации позволяет:

Оптимизировать запросы к базе данных;
Настроить отображение ссылок под конкретный дизайн;
Добавить дополнительные параметры, например, для AJAX-загрузки страниц;
Упростить поддержку и обновление кода;
Избежать конфликтов с другими плагинами.

Основы пагинации в WordPress

WordPress использует класс WP_Query для получения записей из базы данных. Чтобы реализовать пагинацию, нужно задать параметр paged, который отвечает за номер текущей страницы. При этом количество записей на странице регулируется параметром posts_per_page.

Пример базового запроса с пагинацией:

function wptavern_custom_pagination_query() {
    $paged = get_query_var('paged') ? get_query_var('paged') : 1;
    $args = array(
        'post_type' => 'post',
        'posts_per_page' => 10,
        'paged' => $paged
    );

    $query = new WP_Query($args);
    return $query;
}

Этот код возвращает объект запроса с постами текущей страницы.

Создание функции динамической пагинации

Теперь напишем функцию вывода пагинации, которая подстроится под количество страниц и текущую позицию.

function wptavern_dynamic_pagination($custom_query) {
    $total_pages = $custom_query->max_num_pages;
    if ($total_pages <= 1) return; // Пагинация не нужна

    $current_page = max(1, get_query_var('paged'));

    echo '<nav class="wptavern-pagination" role="navigation"><ul>';

    // Кнопка "Назад"
    if ($current_page > 1) {
        echo '<li><a href="' . get_pagenum_link($current_page - 1) . '">< Назад</a></li>';
    }

    // Вывод номеров страниц с ограничением диапазона
    $range = 2; // Количество страниц слева и справа от текущей
    for ($i = 1; $i <= $total_pages; $i++) {
        if ($i == 1 || $i == $total_pages || ($i >= $current_page - $range && $i <= $current_page + $range)) {
            if ($i == $current_page) {
                echo '<li class="active">' . $i . '</li>';
            } else {
                echo '<li><a href="' . get_pagenum_link($i) . '">' . $i . '</a></li>';
            }
        } elseif ($i == $current_page - $range - 1 || $i == $current_page + $range + 1) {
            echo '<li>...</li>';
        }
    }

    // Кнопка "Вперёд"
    if ($current_page < $total_pages) {
        echo '<li><a href="' . get_pagenum_link($current_page + 1) . '">Вперёд ></a></li>';
    }

    echo '</ul></nav>';
}

Эта функция выводит пагинацию с кнопками «Назад», «Вперёд» и номерами страниц с ограниченным диапазоном, чтобы не перегружать интерфейс.

Пример использования на странице архива

Теперь интегрируем нашу пагинацию в шаблон архива, например, archive.php или index.php:

<?php
$query = wptavern_custom_pagination_query();
if ($query->have_posts()) :
    while ($query->have_posts()) : $query->the_post();
        // Вывод контента записи
        the_title('<h2>', '</h2>');
        the_excerpt();
    endwhile;

    wptavern_dynamic_pagination($query);

    wp_reset_postdata();
else :
    echo '<p>Записей не найдено.</p>';
endif;
?>

Обратите внимание на вызов wp_reset_postdata() после цикла — это важно для правильной работы WordPress.

Поддержка AJAX для плавной пагинации

Для улучшения UX можно добавить подгрузку новых страниц без перезагрузки, используя AJAX. Это особенно актуально для блогов и интернет-магазинов, где пользователи хотят быстро переходить между страницами.

Пример базовой реализации AJAX пагинации:

Добавьте скрипт в тему:

function wptavern_enqueue_scripts() {
    wp_enqueue_script('wptavern-ajax-pagination', get_template_directory_uri() . '/js/ajax-pagination.js', array('jquery'), null, true);
    wp_localize_script('wptavern-ajax-pagination', 'wptavern_ajax', array(
        'ajax_url' => admin_url('admin-ajax.php'),
    ));
}
add_action('wp_enqueue_scripts', 'wptavern_enqueue_scripts');

Создайте обработчик в functions.php:

function wptavern_ajax_pagination_handler() {
    $paged = intval($_POST['page']) ? intval($_POST['page']) : 1;

    $args = array(
        'post_type' => 'post',
        'posts_per_page' => 10,
        'paged' => $paged
    );

    $query = new WP_Query($args);

    if ($query->have_posts()) {
        while ($query->have_posts()) {
            $query->the_post();
            echo '<h2>' . get_the_title() . '</h2>';
            echo get_the_excerpt();
        }
    }
    wp_reset_postdata();
    wp_die();
}
add_action('wp_ajax_wptavern_pagination', 'wptavern_ajax_pagination_handler');
add_action('wp_ajax_nopriv_wptavern_pagination', 'wptavern_ajax_pagination_handler');

Пример JS (ajax-pagination.js):

jQuery(document).ready(function($) {
    $('.wptavern-pagination a').on('click', function(e) {
        e.preventDefault();
        var page = $(this).text();
        if (page === 'Назад') {
            page = parseInt($('.wptavern-pagination .active').text()) - 1;
        } else if (page === 'Вперёд') {
            page = parseInt($('.wptavern-pagination .active').text()) + 1;
        }

        $.post(wptavern_ajax.ajax_url, {
            action: 'wptavern_pagination',
            page: page
        }, function(response) {
            $('.posts-container').html(response);
            // Обновить пагинацию или другие элементы при необходимости
        });
    });
});

Этот код отправляет AJAX-запрос при клике на ссылку пагинации и подгружает новые записи в контейнер .posts-container без перезагрузки страницы.

Заключение

Создание собственной динамической пагинации в WordPress даёт большую гибкость и улучшает производительность сайта. Вы научились реализовывать пагинацию с учётом текущей страницы, ограничивать количество отображаемых ссылок и даже добавлять AJAX-подгрузку. Такой подход подойдёт как для блогов, так и для сложных проектов с большим объёмом контента.

Если хотите быстро добавить готовые решения, обратите внимание на плагин ABC Pagination от WPSHOP, который предоставляет расширенную функциональность и удобный интерфейс настройки пагинации.