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

Автор: Владимир Карпов | Опубликовано: 04.04.2026

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

Что такое динамические тематические блоки и зачем они нужны

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

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

Основные преимущества динамических блоков:

Автоматическое обновление содержимого без участия администратора;
Удобство навигации для посетителей благодаря фильтрам и пагинации;
Гибкость настройки вывода с помощью WP_Query и хуков;
Оптимизация загрузки страниц за счёт подгрузки данных по запросу.

Создание кастомного WP_Query для тематических блоков

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

Пример базового запроса для вывода 6 записей из категории с ID 4:

function wp_themes_get_dynamic_block() {
    $args = [
        'post_type' => 'post',
        'cat' => 4,
        'posts_per_page' => 6,
        'paged' => get_query_var('paged') ? get_query_var('paged') : 1
    ];
    $query = new WP_Query($args);

    if ($query->have_posts()) {
        echo '<div class="dynamic-block">';
        while ($query->have_posts()) {
            $query->the_post();
            echo '<article>';
            echo '<h2><a href="' . get_permalink() . '">' . get_the_title() . '</a></h2>';
            echo '<p>' . get_the_excerpt() . '</p>';
            echo '</article>';
        }
        echo '</div>';

        // Постраничная навигация
        echo paginate_links([
            'total' => $query->max_num_pages
        ]);
    } else {
        echo '<p>Записей не найдено.</p>';
    }
    wp_reset_postdata();
}

Этот пример выводит записи в блоке с пагинацией. Для полной работы пагинации в шаблоне должен поддерживаться параметр paged.

Добавление AJAX-фильтрации для динамических блоков

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

Пример простой реализации AJAX-фильтра по категории:

1. JavaScript для отправки AJAX-запроса

jQuery(document).ready(function($) {
    $('#filter-select').on('change', function() {
        var catID = $(this).val();
        $.ajax({
            url: wpThemesAjax.ajaxurl,
            type: 'POST',
            data: {
                action: 'wp_themes_filter_posts',
                category: catID
            },
            success: function(response) {
                $('#dynamic-block-container').html(response);
            }
        });
    });
});

2. PHP обработчик AJAX-запроса

add_action('wp_ajax_wp_themes_filter_posts', 'wp_themes_filter_posts_callback');
add_action('wp_ajax_nopriv_wp_themes_filter_posts', 'wp_themes_filter_posts_callback');

function wp_themes_filter_posts_callback() {
    $cat = intval($_POST['category']);
    $args = [
        'post_type' => 'post',
        'cat' => $cat,
        'posts_per_page' => 6
    ];
    $query = new WP_Query($args);

    if ($query->have_posts()) {
        while ($query->have_posts()) {
            $query->the_post();
            echo '<article>';
            echo '<h2><a href="' . get_permalink() . '">' . get_the_title() . '</a></h2>';
            echo '<p>' . get_the_excerpt() . '</p>';
            echo '</article>';
        }
    } else {
        echo '<p>Записей не найдено.</p>';
    }
    wp_die();
}

3. HTML для фильтра и контейнера

В файле шаблона добавьте:

<select id="filter-select">
  <option value="0">Все категории</option>
  <option value="4">Категория 1</option>
  <option value="5">Категория 2</option>
</select>
<div id="dynamic-block-container">
  <?php wp_themes_get_dynamic_block(); ?>
</div>

Использование плагинов для расширения функционала тематических блоков

Если вы хотите упростить задачу или добавить дополнительные функции (например, расширенные фильтры, AJAX-подгрузку, кэширование), стоит рассмотреть плагины:

Clearfy Pro — оптимизация и улучшение производительности вывода динамических блоков, удаление лишних скриптов и стилей. Подробнее на https://wpshop.ru/plugins/clearfy-pro/
ABC Pagination — улучшает пагинацию и добавляет удобные стили и настройки. Подробнее на https://wpshop.ru/plugins/abc-pagination/
WPRemark — позволяет добавить отзывы и рейтинги в динамические блоки, что полезно для тематических сайтов с товарами или услугами. Подробнее на https://wpshop.ru/plugins/wpremark/

Оптимизация и безопасность динамических тематических блоков

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

Рекомендации:

Используйте wp_cache или transient API для кэширования запросов и снижения нагрузки на базу данных.
Фильтруйте и проверяйте входящие данные, особенно при работе с AJAX, чтобы избежать SQL-инъекций и XSS.
Минимизируйте количество подключаемых скриптов и стилей, загружайте их только на нужных страницах.
Для пагинации и фильтров используйте правильные параметры и валидируйте их через absint() и sanitize_text_field().

Пример кэширования запросов для динамического блока

function wp_themes_get_cached_dynamic_block($cat = 4, $page = 1) {
    $cache_key = 'wp_themes_block_cat_' . $cat . '_page_' . $page;
    $cached = get_transient($cache_key);
    if ($cached) {
        echo $cached;
        return;
    }

    ob_start();
    $args = [
        'post_type' => 'post',
        'cat' => $cat,
        'posts_per_page' => 6,
        'paged' => $page
    ];
    $query = new WP_Query($args);

    if ($query->have_posts()) {
        echo '<div class="dynamic-block">';
        while ($query->have_posts()) {
            $query->the_post();
            echo '<article>';
            echo '<h2><a href="' . get_permalink() . '">' . get_the_title() . '</a></h2>';
            echo '<p>' . get_the_excerpt() . '</p>';
            echo '</article>';
        }
        echo '</div>';
    } else {
        echo '<p>Записей не найдено.</p>';
    }
    wp_reset_postdata();

    $output = ob_get_clean();
    set_transient($cache_key, $output, HOUR_IN_SECONDS);

    echo $output;
}

Заключение

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

Если хотите расширить функционал и упростить разработку, рекомендуем обратить внимание на плагины с https://wpshop.ru/ — они отлично дополняют возможности темы и помогают решать типовые задачи без лишнего кода.