Как делать такие фильтры на wordpress?

Изучаю wordpress и хотел бы узнать как делаются вот такие сайты агрегаторы на этом движке.
Поделитесь пожалуйста обучающими материалами для такой фильтрации или же может кто кинет тему с таким функционалом, чтобы разобрать как такое строить. Буду очень благодарен.
62e20074b8590701341624.png
  • Вопрос задан
  • 611 просмотров
Пригласить эксперта
Ответы на вопрос 1
artzolin
@artzolin Куратор тега WordPress
php, WordPress разработка сайтов artzolin.ru
1. Регистрируете гет-переменные

add_filter( 'query_vars', 'add_query_vars' );
function add_query_vars( $qvars ) {

  $qvars[] = 'location';
  $qvars[] = 'from';
  $qvars[] = 'to';
  $qvars[] = 'type';

  return $qvars;
}


2. Собираете и выводите html-форму

<form method="get" class="block obj-filter">
  <div class="row d-flex align-items-center">
    <div class="col-12 col-md-6 col-lg-3 col-margin-bottom-small col-lg-margin-bottom-none">
      <input type="text" name="location" id="location" class="obj-filter-input" value="">
    </div>
    <div class="col-12 col-md-6 col-lg-3 col-margin-bottom-small col-lg-margin-bottom-none">
      <input type="date" name="from" id="from" class="obj-filter-input" value="">
    </div>
    <div class="col-12 col-md-6 col-lg-3 col-margin-bottom-small col-lg-margin-bottom-none">
      <input type="date" name="to" id="to" class="obj-filter-input" value="">
    </div>
    <div class="col-12 col-md-6 col-lg-3 col-margin-bottom-small col-lg-margin-bottom-none">
      <select name="type" id="type" class="obj-select">
        <option value="solo">Один взрослый</option>
        <option value="two-adults">Два взрослых</option>
        <option value="family">Двое взрослых + ребенок</option>
      </select>
    </div>
    <div class="col-12 col-md-6 col-lg-3 col-margin-bottom-small col-lg-margin-bottom-none">
      <input id="obj-filter-submit" type="submit" class="button" value="Фильтровать">
    </div>
  </div>
</form>


3. При нажатии кнопки Фильтровать страница перезагружается, вы получаете ссылку такого вида

https://example.loc/?location=yerevan&from=2807&to=0408&type=solo


На хуке pre_get_posts можно поправить основной запрос вытянув данные из гет-параметров. Вам нужно установить новые tax_query или meta_query в зависимости от логики сайта

add_action( 'pre_get_posts', 'custom_pre_get_posts', 1 );
function custom_pre_get_posts( $query ) {
  // Выходим, если это админ-панель или не основной запрос.
  if ( is_admin() || ! $query->is_main_query() )
    return;

  // предположим, что это таксономия с машинами
  if ( $query->is_tax( 'location' ) ) {
    
    $meta = array();
    $meta['meta_query']['relation'] = 'AND';

    // выбираем записи с GET запросами
    $query_vars = array( 'location', 'from', 'to', 'type' );
    foreach ( $query_vars as $key => $query_var ) {
      if ( $var = get_query_var( $query_var, false ) ) {
        // Тут пишем логику по которой собирается переменная meta_query и/или tax_query
      }
    }
    $query->set( 'meta_query', $meta );
  }
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы