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

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

Почему стоит отказаться от плагинов для пагинации

Плагины пагинации удобны, но нередко приводят к:
– Избыточной нагрузке на сайт;
– Конфликтам с другими плагинами;
– Ограниченной кастомизации;
– Необходимости обновлений и дополнительного обслуживания.

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

Основные функции WordPress для пагинации

Для создания пагинации нам понадобятся функции:

• paginate_links() — формирует ссылки пагинации;
• get_query_var('paged') — определяет текущую страницу;
• WP_Query — для кастомного запроса с пагинацией.

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

Пример кода: создание динамической пагинации

Ниже пример функции, которую можно добавить в файл functions.php вашей темы или в отдельный плагин с префиксом wpengine_. Эта функция выводит пагинацию для текущего запроса.

function wpengine_dynamic_pagination() {
    global $wp_query;
    $big = 999999999; // уникальное число для замены

    $pages = paginate_links(array(
        'base'      => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
        'format'    => '?paged=%#%',
        'current'   => max(1, get_query_var('paged')),
        'total'     => $wp_query->max_num_pages,
        'type'      => 'array',
        'prev_text' => '<',
        'next_text' => '>'
    ));

    if (is_array($pages)) {
        echo '<nav class="wpengine-pagination"><ul>';
        foreach ($pages as $page) {
            echo '<li>' . $page . '</li>';
        }
        echo '</ul></nav>';
    }
}

Чтобы вывести пагинацию в шаблоне, например в index.php или archive.php, достаточно вызвать:

<?php wpengine_dynamic_pagination(); ?>

Кастомизация пагинации: стили и дополнительные параметры

Для удобства пользователей стоит добавить стили для пагинации. Например:

.wpengine-pagination ul {
    list-style: none;
    display: flex;
    gap: 8px;
    padding: 0;
}

.wpengine-pagination li {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.wpengine-pagination li .current {
    background-color: #0073aa;
    color: #fff;
    border-color: #0073aa;
}

В функцию paginate_links() можно добавить параметры для управления количеством отображаемых ссылок, типа URL и прочего. Например:

'end_size' => 1, // количество ссылок в начале и конце
'mid_size' => 2, // количество ссылок вокруг текущей
'total'    => $wp_query->max_num_pages,
'current'  => max(1, get_query_var('paged'))

Реализация пагинации для кастомного запроса WP_Query

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

$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
    'post_type'      => 'post',
    'posts_per_page' => 5,
    'paged'          => $paged
);
$query = new WP_Query($args);

if ($query->have_posts()) {
    while ($query->have_posts()) {
        $query->the_post();
        // вывод записи
    }

    // Пагинация
    $big = 999999999;
    $pages = paginate_links(array(
        'base'      => str_replace($big, '%#%', esc_url(get_pagenum_link($big))),
        'format'    => '?paged=%#%',
        'current'   => $paged,
        'total'     => $query->max_num_pages,
        'type'      => 'array',
        'prev_text' => '<',
        'next_text' => '>'
    ));

    if (is_array($pages)) {
        echo '<nav class="wpengine-pagination"><ul>';
        foreach ($pages as $page) {
            echo '<li>' . $page . '</li>';
        }
        echo '</ul></nav>';
    }
}
wp_reset_postdata();

Советы по улучшению пагинации и SEO

Для правильной индексации страниц пагинации и улучшения SEO придерживайтесь следующих рекомендаций:

• Используйте канонические URL, чтобы избежать дублирования контента;
• Добавьте в head rel="prev" и rel="next" для страниц пагинации;
• Оптимизируйте вывод ссылок, не выводите слишком много страниц, чтобы не перегружать интерфейс;
• Продумайте адаптивную верстку пагинации для мобильных устройств.

Для добавления rel="prev" и rel="next" можно использовать следующий код в functions.php:

function wpengine_add_pagination_rel() {
    if (is_singular()) return;
    global $wp_query;
    $paged = max(1, get_query_var('paged'));
    $max_pages = $wp_query->max_num_pages;

    if ($paged > 1) {
        echo '<link rel="prev" href="' . get_pagenum_link($paged - 1) . '" />';
    }
    if ($paged < $max_pages) {
        echo '<link rel="next" href="' . get_pagenum_link($paged + 1) . '" />';
    }
}
add_action('wp_head', 'wpengine_add_pagination_rel');

Использование плагинов WPShop для расширения функций пагинации

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

Для быстрой интеграции ABC Pagination примените следующий пример:

if (function_exists('abc_pagination')) {
    abc_pagination();
} else {
    wpengine_dynamic_pagination();
}

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

Выводы и рекомендации

Создание динамической пагинации в WordPress без плагинов — это эффективный способ контролировать навигацию по сайту, улучшить производительность и SEO. Используйте стандартные функции WordPress, дополняйте стили и параметры для удобства пользователей. При желании расширьте возможности с помощью специализированных плагинов из каталога WPSHOP, таких как ABC Pagination.