Как сделать фильтры, поиск по WP_Query?

Question

[Артем Колчин]

Есть главная страница (статическая) и там вывод

<?php

                $query_args = [
                    'post_type' => 'offer',
                    'posts_per_page' => 5,
                    'paged' => $paged,
                ];

                $offer_query = new WP_Query($query_args);

                if ($offer_query->have_posts()):
                    while ($offer_query->have_posts()):
                        $offer_query->the_post(); ?>

                    endwhile;
                    wp_reset_postdata();
 <?php endif; ?>

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

Пытался через гет параметры передать например

if (!empty($_GET['s'])) {
    $query_args['s'] = sanitize_text_field($_GET['s']);
}

но при попытке поиска он кидает на страницу поиска

<form class="offers__search" method="get" action="<?php echo esc_url(home_url('/')); ?>">
                <button type="submit">Искать</button>
                <input type="hidden" name="post_type" value="offer">
                <input type="text" name="s" placeholder="Поиск по проектам" value="<?php echo get_search_query(); ?>">
            </form>

Как вообще правильно сделать вывод на главной постов чтоб можно было их фильтровать, сортировать, и работала пагинация. Опять же планирую еще сортировку по ACF полям .

Comments

[Refguser]

Как вообще правильно сделать

Использовать готовый плагин.

Answer 1

[Антон]

Про поиск я не понял
а по поводу фильтрации я делаю так
вот код формы для фильтра где например фильтриуем по атрибуту atribut1 и atribut2

<div class="catalog-filter">
    <form method="POST" action="/wp-admin/admin-ajax.php" class="filter_go row">
        <input type="hidden" name="action" value="myfilter"><!-- название фильтра -->
        <input type="hidden" name="id" value="53"><!-- id категории откуда берутся записи -->
        <div class="col">
            <select class="input-control" name="atribut1">
                <option value="">Фильтр</option>
                <option value="Значение1">Значение1</option>
                <option value="Значение2">Значение2</option>
                <option value="Значение3">Значение3</option>
                <option value="Значение4">Значение4</option>
                <option value="Значение5">Значение5</option>
                <option value="Значение6">Значение6</option>
            </select>
        </div>
        <div class="col">
            <select class="input-control" name="atribut2">
                <option value="">Фильтр</option>
                <option value="Значение1">Значение1</option>
                <option value="Значение2">Значение2</option>
                <option value="Значение3">Значение3</option>
                <option value="Значение4">Значение4</option>
                <option value="Значение5">Значение5</option>
                <option value="Значение6">Значение6</option>
            </select>
        </div>
    </form>
</div>

Дале через js передаем данные ajax-ом отправляем и потом принимаем и вставляем в блок с классом catalog-row

$.ajax({
        url:filter.attr('action'),
        data:filter.serialize(), // form data
        type:filter.attr('method'), // POST
        beforeSend:function(xhr){
            $('.catalog-row').html('<p><b>Загрузка...</b></p>'); // insert data
        },
        success:function(data){
            $('.catalog-row').html(data); // insert data
        }
    });

ну сам код который вставляем в functions.php

<?php
add_action('wp_ajax_myfilter', 'misha_filter_function'); // wp_ajax_{ACTION HERE}
add_action('wp_ajax_nopriv_myfilter', 'misha_filter_function');

function misha_filter_function(){

$atribut1 = $_POST['atribut1'];
$atribut2 = $_POST['atribut2'];


if($atribut1){
  $mass[] = [
    'key' => 'atribut1',
    'value' => $atribut1
  ];
}
if($atribut2){
  $mass[] = [
    'key' => 'atribut2',
    'value' => $atribut2
  ];
}


  $args = array(
    'orderby' => 'date', // we will sort posts by date
    'order' => 'ASC', // ASC or DESC
    'posts_per_page' => 999,
    'meta_query' => [
      'relation' => 'AND',
      $mass
    ]
  );
    $args['tax_query'] = array(
      array(
        'taxonomy' => 'category',
        'field' => 'id',
        'terms' => $_POST['id']
      )
    );

  // if you want to use multiple checkboxed, just duplicate the above 5 lines for each checkbox
  $query = new WP_Query( $args );
  if( $query->have_posts() ) :
    while( $query->have_posts() ): $query->the_post();
      $field = get_fields(); ?>
        <div class="col-xl-3 col-md-6 col-sm-6">
            <div class="catalog-box base-box">
                <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail( 'medium' ); ?></a>
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
            </div>
        </div>
<?php    endwhile;
    wp_reset_postdata();
  else : 
        echo 'Нет товаров';
  endif;
  die();
}
?>

Дальше таким же образом можно делать пагинацию и другие фильтры и поиск