Как реализовать поиск с фильтром wordpress + acf?

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

Пытаюсь реализовать фильтр такого плана:

Как реализовать поиск с фильтром wordpress + acf?

Сделал форму в html (код ниже), но вот не могу понят как с ней действовать дальше, как мне передать значения и отфильтровать по ним кастомные типы записи. В кастомном типе записи использую acf поля для ввод информации об обьекте. И как сделать так что бы при поиски или перезагрузке страницы сохранялись те фильтра, которые выбрал пользователь.
Вот такую форму сделал:

<form>                     <div class="filter_block">                         <div class="initially_shown_filters">                              <div class="filter_input open_options">                                  <div class="category_name">                                     <div class="category_text">                                         Тип объекта                                     </div>                                 </div>                                  <div class="preview_selected_items">                                     Выбрать                                 </div>                                  <div class="options_item_list">                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_apartment" value="apartment" data-filter="object_type" data-name="Квартира">                                         <label for="object_type_apartment">Квартира</label>                                     </div>                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_penthouse_and_dublex" value="penthouse_and_dublex" data-filter="object_type" data-name="Пентхаус/Дублекс">                                         <label for="object_type_penthouse_and_dublex">Пентхаус/Дублекс</label>                                     </div>                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_villa" value="villa" data-filter="object_type" data-name="Вилла">                                         <label for="object_type_villa">Вилла</label>                                     </div>                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_land" value="land" data-filter="object_type" data-name="Земля">                                         <label for="object_type_land">Земля</label>                                     </div>                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_commercial" value="commercial" data-filter="object_type" data-name="Коммерческая">                                         <label for="object_type_commercial">Коммерческая</label>                                     </div>                                     <div class="option_item">                                         <input type="checkbox" name="object_type[]" id="object_type_hotels" value="hotels" data-filter="object_type" data-name="Отели">                                         <label for="object_type_hotels">Отели</label>                                     </div>                                 </div>                             </div>                              <div class="filter_input">                                  <div class="category_name">                                     <div class="category_text">                                         Цена                                      </div>                                 </div>                                  <div class="price_inputs">                                     <input type="text" name="cena_min" placeholder="От" />                                     <input type="text" name="cena_max" placeholder="До" />                                 </div>                             </div>                              <div class="filter_input object_id">                                  <div class="category_name">                                     <div class="category_text">                                         ID Объекта                                     </div>                                 </div>                                  <div class="id_object_input">                                     <input type="text" name="object_id" />                                 </div>                             </div>                          </div>                         <div class="navigation_btns_filter">                             <div class="side more_and_refresh">                                  <div class="show_or_hide_filters">                                      <button class="more_filters">                                         Больше фильтров                                     </button>                                      <button class="hide_filters">                                         Свернуть фильтры                                     </button>                                  </div>                                  <button class="refresh_filters">                                     Сбросить фильтр                                  </button>                              </div>                             <button class="search_btn">                                 Поиск                             </button>                         </div>                     </div>                 </form>

<form> <div class="filter_block"> <div class="initially_shown_filters"> <div class="filter_input open_options"> <div class="category_name"> <div class="category_text"> Тип объекта </div> </div> <div class="preview_selected_items"> Выбрать </div> <div class="options_item_list"> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_apartment" value="apartment" data-filter="object_type" data-name="Квартира"> <label for="object_type_apartment">Квартира</label> </div> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_penthouse_and_dublex" value="penthouse_and_dublex" data-filter="object_type" data-name="Пентхаус/Дублекс"> <label for="object_type_penthouse_and_dublex">Пентхаус/Дублекс</label> </div> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_villa" value="villa" data-filter="object_type" data-name="Вилла"> <label for="object_type_villa">Вилла</label> </div> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_land" value="land" data-filter="object_type" data-name="Земля"> <label for="object_type_land">Земля</label> </div> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_commercial" value="commercial" data-filter="object_type" data-name="Коммерческая"> <label for="object_type_commercial">Коммерческая</label> </div> <div class="option_item"> <input type="checkbox" name="object_type[]" id="object_type_hotels" value="hotels" data-filter="object_type" data-name="Отели"> <label for="object_type_hotels">Отели</label> </div> </div> </div> <div class="filter_input"> <div class="category_name"> <div class="category_text"> Цена </div> </div> <div class="price_inputs"> <input type="text" name="cena_min" placeholder="От" /> <input type="text" name="cena_max" placeholder="До" /> </div> </div> <div class="filter_input object_id"> <div class="category_name"> <div class="category_text"> ID Объекта </div> </div> <div class="id_object_input"> <input type="text" name="object_id" /> </div> </div> </div> <div class="navigation_btns_filter"> <div class="side more_and_refresh"> <div class="show_or_hide_filters"> <button class="more_filters"> Больше фильтров </button> <button class="hide_filters"> Свернуть фильтры </button> </div> <button class="refresh_filters"> Сбросить фильтр </button> </div> <button class="search_btn"> Поиск </button> </div> </div> </form>

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

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

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

Заказать помощь
Лучший ответ
1
Frontend-редакция Ответ

Фильтр лучше делать через GET-параметры. Тогда выбранные значения сохраняются в URL, после перезагрузки страницы форма остаётся в том же состоянии, а результат можно индексировать или отправлять ссылкой.

У формы должен быть method="get", а поля — нормальные имена:

<form method="get" action="" class="objects-filter">
    <label>
        <input type="checkbox" name="object_type[]" value="apartment">
        Квартира
    </label>
 
    <label>
        <input type="checkbox" name="object_type[]" value="house">
        Дом
    </label>
 
    <button type="submit">Показать</button>
</form>

<form method="get" action="" class="objects-filter"> <label> <input type="checkbox" name="object_type[]" value="apartment"> Квартира </label> <label> <input type="checkbox" name="object_type[]" value="house"> Дом </label> <button type="submit">Показать</button> </form>

В шаблоне собираете meta_query по ACF-полям:

$object_types = isset($_GET['object_type'])
    ? array_map('sanitize_text_field', (array) $_GET['object_type'])
    : [];
 
$meta_query = ['relation' => 'AND'];
 
if ($object_types) {
    $meta_query[] = [
        'key'     => 'object_type',
        'value'   => $object_types,
        'compare' => 'IN',
    ];
}
 
$query = new WP_Query([
    'post_type'      => 'object',
    'post_status'    => 'publish',
    'posts_per_page' => 12,
    'paged'          => max(1, get_query_var('paged')),
    'meta_query'     => count($meta_query) > 1 ? $meta_query : [],
]);

$object_types = isset($_GET['object_type']) ? array_map('sanitize_text_field', (array) $_GET['object_type']) : []; $meta_query = ['relation' => 'AND']; if ($object_types) { $meta_query[] = [ 'key' => 'object_type', 'value' => $object_types, 'compare' => 'IN', ]; } $query = new WP_Query([ 'post_type' => 'object', 'post_status' => 'publish', 'posts_per_page' => 12, 'paged' => max(1, get_query_var('paged')), 'meta_query' => count($meta_query) > 1 ? $meta_query : [], ]);

Чтобы чекбоксы оставались выбранными:

<input
    type="checkbox"
    name="object_type[]"
    value="apartment"
    <?php checked(in_array('apartment', $object_types, true)); ?>
>

<input type="checkbox" name="object_type[]" value="apartment" <?php checked(in_array('apartment', $object_types, true)); ?> >

Если ACF-поле хранит не простую строку, а массив/relationship/checkbox, запрос может отличаться. Для checkbox ACF часто приходится использовать LIKE по сериализованному значению, но если фильтр важный и данных много, лучше хранить отдельное нормализованное meta-поле или таксономию. Для “тип объекта”, “город”, “район” таксономии обычно лучше, чем ACF meta.

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

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

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

комментарий

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

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

VPN Как правильно настроить vless для Android TV? 0 ответов Pyrogram Как правильно зарегистрировать юзер бота в Telegram? 0 ответов печатные-платы Как заставить запускаться программу M3.exe от компании Hanxing AOI в инспекционной машине на Windows 7 Pro? 0 ответов Аккумуляторные батареи Почему при зарядке автостарта слышен писк, где искать причину? 0 ответов