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

Пагинация является важной частью пользовательского интерфейса, особенно на сайтах с большим количеством записей или товаров. Однако стандартная пагинация WordPress зачастую ограничена простыми кнопками «Назад» и «Вперед» или нумерацией страниц. В этой статье мы рассмотрим, как создать многоуровневую пагинацию, которая позволит пользователям более удобно ориентироваться в записях, учитывая и категории, и постраничный вывод.

Зачем нужна многоуровневая пагинация в WordPress

Многоуровневая пагинация – это способ разбить контент не только по страницам, но и по уровням, например, по категориям с последующей разбивкой по страницам внутри каждой категории. Это актуально для сайтов с большим объемом контента, когда простая пагинация не помогает быстро найти нужный материал.

Преимущества многоуровневой пагинации:

• Улучшенная навигация для пользователей;
• Повышение времени пребывания на сайте;
• Оптимизация индексации поисковыми системами за счет более структурированной навигации;
• Гибкость в отображении контента по разным критериям.

Как реализовать многоуровневую пагинацию — основные подходы

Для реализации многоуровневой пагинации в WordPress существует несколько способов:

1. Использование кастомных запросов WP_Query с параметрами для категорий и пагинации.
2. Создание собственного класса пагинации с поддержкой многоуровневых ссылок.
3. Применение плагинов с расширенными возможностями пагинации.

Далее подробно рассмотрим создание кастомной пагинации с примером кода.

Шаг 1. Создание запроса с фильтрацией по категории и пагинацией

Для начала нам нужно получить текущую категорию и номер страницы пагинации. В WordPress текущий номер страницы можно получить через get_query_var('paged'), а категорию — через get_query_var('category_name') или другой параметр.

function wpexamples_get_custom_query() {
    $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
    $category = get_query_var('category_name');

    $args = [
        'post_type' => 'post',
        'posts_per_page' => 5,
        'paged' => $paged,
    ];

    if ($category) {
        $args['category_name'] = $category;
    }

    return new WP_Query($args);
}

Этот код позволит получить записи с разбивкой по страницам и, если указана категория, отфильтровать посты по ней.

Шаг 2. Вывод пагинации с поддержкой уровней

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

function wpexamples_custom_pagination($wp_query) {
    $big = 999999999; // уникальное число для замены
    $category = get_query_var('category_name');

    $base = $category ? get_category_link(get_category_by_slug($category)->term_id) . '%_%' : get_pagenum_link(1) . '%_%';

    $pagination = paginate_links([
        'base' => str_replace($big, '%#%', $base . (strpos($base, '?') === false ? '?paged=%#%' : '&paged=%#%')),
        'format' => '',
        'current' => max(1, get_query_var('paged')),
        'total' => $wp_query->max_num_pages,
        'type' => 'list',
        'prev_text' => '« Назад',
        'next_text' => 'Вперед »',
    ]);

    if ($pagination) {
        echo '<nav class="wpexamples-pagination">' . $pagination . '</nav>';
    }
}

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

Пример вывода многоуровневой пагинации в шаблоне

В файле шаблона (например, category.php или archive.php) можно использовать наши функции следующим образом:

$custom_query = wpexamples_get_custom_query();

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

    wpexamples_custom_pagination($custom_query);

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

Таким образом, пользователь видит записи категории с удобной навигацией по страницам.

Расширение пагинации: добавление уровней подкатегорий

Если у вас есть вложенные категории, можно реализовать дополнительный уровень навигации — список подкатегорий текущей категории.

Вывод подкатегорий текущей категории

function wpexamples_list_subcategories() {
    $current_cat = get_queried_object();

    if (!$current_cat || !isset($current_cat->term_id)) {
        return;
    }

    $subcats = get_categories(['parent' => $current_cat->term_id]);

    if (!empty($subcats)) {
        echo '<ul class="wpexamples-subcategories">';
        foreach ($subcats as $subcat) {
            $link = get_category_link($subcat->term_id);
            echo '<li><a href="' . esc_url($link) . '">' . esc_html($subcat->name) . '</a></li>';
        }
        echo '</ul>';
    }
}

Добавьте вызов wpexamples_list_subcategories() в шаблон перед списком постов, чтобы пользователь мог переключаться между подкатегориями, а пагинация будет работать внутри выбранной подкатегории.

Плагины для расширенной пагинации в WordPress

Если не хочется писать код, можно использовать плагины с поддержкой расширенной пагинации:

• WP-PageNavi — популярный плагин, предоставляющий удобные возможности для кастомизации пагинации.
• Pagination by Supsystic — позволяет создавать красивые и гибкие пагинации с множеством настроек.
• ABC Pagination — плагин с расширенными возможностями, который можно использовать для многоуровневой пагинации и интеграции с кастомными типами записей.

Заключение: советы по использованию многоуровневой пагинации

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

• Сохранять читаемость URL, лучше использовать ЧПУ с категориями и номерами страниц.
• Оптимизировать запросы WP_Query, чтобы пагинация не замедляла загрузку страниц.
• Тестировать пагинацию на разных устройствах — она должна быть удобной и на мобильных.
• Использовать семантическую разметку для навигации (например, <nav> и aria-label) для SEO и доступности.

Правильная многоуровневая пагинация значительно улучшает пользовательский опыт и помогает структурировать большой объем контента.