Как сделать фильтр постов по категориям?

Ссылка скопирована
1 ответ

Как сделать фильтр постов по категориям, как на фото?
Фильтр делается не на странице архива, а на обычной странице.

Как сделать фильтр постов по категориям?

Дополнительно

Ответы:

В общем случае как-то так. Передаете GET или POST параметр с id категории и добавляете к аргументам основного запроса tax_query get_posts(array(     'post_type' => 'post',     'status' => 'publish',     'tax_query' => array(          array(             'taxonomy' => 'category',             'field' => 'id',             'terms' => ( isset( $_GET['category_id'] ) && intval($_GET['category_id'])  ) ? intval($_GET['category_id']) : $default_cat_id ,             )         ),      ) );

В общем случае как-то так. Передаете GET или POST параметр с id категории и добавляете к аргументам основного запроса tax_query get_posts(array( 'post_type' => 'post', 'status' => 'publish', 'tax_query' => array( array( 'taxonomy' => 'category', 'field' => 'id', 'terms' => ( isset( $_GET['category_id'] ) && intval($_GET['category_id']) ) ? intval($_GET['category_id']) : $default_cat_id , ) ), ) );

Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Редакция по БД Ответ

На обычной странице фильтр постов по категориям делается через параметр в URL или AJAX. Самый простой вариант без AJAX: форма отправляет cat методом GET, а WP_Query получает выбранную категорию и строит список записей.

$selected_cat = isset($_GET['cat']) ? absint($_GET['cat']) : 0;
 
$args = [
    'post_type' => 'post',
    'posts_per_page' => 12,
    'paged' => max(1, get_query_var('paged')),
];
 
if ($selected_cat) {
    $args['cat'] = $selected_cat;
}
 
$query = new WP_Query($args);

$selected_cat = isset($_GET['cat']) ? absint($_GET['cat']) : 0; $args = [ 'post_type' => 'post', 'posts_per_page' => 12, 'paged' => max(1, get_query_var('paged')), ]; if ($selected_cat) { $args['cat'] = $selected_cat; } $query = new WP_Query($args);

Форма:

<form method="get">
    <select name="cat">
        <option value="0">Все категории</option>
        <?php foreach (get_categories() as $cat) : ?>
            <option value="<?php echo esc_attr($cat->term_id); ?>" <?php selected($selected_cat, $cat->term_id); ?>>
                <?php echo esc_html($cat->name); ?>
            </option>
        <?php endforeach; ?>
    </select>
    <button type="submit">Фильтровать</button>
</form>

<form method="get"> <select name="cat"> <option value="0">Все категории</option> <?php foreach (get_categories() as $cat) : ?> <option value="<?php echo esc_attr($cat->term_id); ?>" <?php selected($selected_cat, $cat->term_id); ?>> <?php echo esc_html($cat->name); ?> </option> <?php endforeach; ?> </select> <button type="submit">Фильтровать</button> </form>

Если нужен фильтр как на картинке с кнопками, вместо select выводите ссылки с ?cat=ID. Для нескольких категорий используйте category__in. Если страница статическая, не используйте query_posts(): он ломает глобальный запрос и пагинацию. Создавайте отдельный WP_Query и после цикла вызывайте wp_reset_postdata().

Для AJAX-версии принцип тот же, только выбранный ID категории отправляется в обработчик, а сервер возвращает HTML карточек. Не фильтруйте записи только на фронте, если записей много: вы сначала загрузите лишний контент, а потом спрячете его CSS-ом. Это плохо для скорости. Если нужны красивые URL, можно оставить GET-параметр: он понятен, индексируемость контролируется, а пользователь может скопировать ссылку на уже отфильтрованную подборку.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно

Linux Как диагностировать зависание RK3568 U-boot на Starting kernel? 1 ответ Visual Studio Code Как лучше убрать тень у панели слева в VS Code? 1 ответ linkedin Из-за чего выкидывает из аккаунта LinkedIn? 1 ответ code-review Нужен ли код-ревью React/TypeScript проекта? 1 ответ