Отобразить пользовательские типы записей в выпадающем списке с опцией “все”

Вопрос или проблема

<form method="GET" action="<?php echo esc_url( home_url() ); ?>">   
    <div class="select-wrap">
        <label>Выберите локацию</label>

        <?php 
        $args = array(
            'show_option_all' => 'Все локации',
            'hierarchical' => 1,
            'hide_empty' => 0,
            'orderby' => 'name',
            'echo' => 1,
            'value_field' => 'slug',
        );

        $args['taxonomy'] = 'location';
        $args['class'] = 'select--field';

        wp_dropdown_categories( $args ); 
        ?>

    </div>

    <div class="select-wrap">
        <label>Выберите услугу</label>

        <select class="select--field">

            <?php
            $args = array(
                    'post_type' => 'service',
                    'posts_per_page' => -1
            );

            $query = new WP_Query( $args );

            while ( $query->have_posts() ) : $query->the_post();
                    echo '<option value="' . get_the_ID() . '">' . get_the_title() . '</option>';
            endwhile;
            wp_reset_postdata();
            ?>

        </select> 
    </div>

    <input type="hidden" name="taxonomy" value="location">
    <input type="hidden" name="post_type" value="service">

    <button type="submit" class="search-btn btn--lg">Отправить</button>
</form> 

...
echo '<option value="">Все локации</option>';
$query = new WP_Query( $args );
while ( $query->have_posts() ) : $query->the_post();
    echo '<option value="' . get_the_ID() . '">' . get_the_title() . '</option>';
endwhile;
...

Ответ или решение

Для отображения пользовательских типов записей в выпадающем списке с опцией "Все" можно использовать подход, аналогичный тому, который применяется к функции wp_dropdown_categories(). Несмотря на то, что встроенная функция не поддерживает подобный вызов для произвольных типов записей, можно легко создать выпадающий список с первым значением "Все", добавив пустое значение в начало.

Вот как можно организовать такой функционал:

Шаг 1: Создание формы

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

Шаг 2: Добавление опции "Все"

Чтобы включить опцию "Все" в выпадающий список с услугами, просто добавьте пустой элемент перед циклом, который выводит ваши записи. Ниже приведен пример реализации:

<form method="GET" action="<?php echo esc_url( home_url() ); ?>">
    <div class="select-wrap">
        <label>Выберите местоположение</label>
        <?php 
        $args = array(
            'show_option_all' => 'Все местоположения',
            'hierarchical' => 1,
            'hide_empty' => 0,
            'orderby' => 'name',
            'echo' => 1,
            'value_field' => 'slug',
        );

        $args['taxonomy'] = 'location';
        $args['class'] = 'select--field';

        wp_dropdown_categories($args); 
        ?>
    </div>

    <div class="select-wrap">
        <label>Выберите услугу</label>
        <select name="service" class="select--field">
            <option value="">Все услуги</option> <!-- Опция "Все услуги" -->
            <?php
            $args = array(
                'post_type' => 'service',
                'posts_per_page' => -1
            );

            $query = new WP_Query($args);

            while ($query->have_posts()) : $query->the_post();
                echo '<option value="' . get_the_ID() . '">' . get_the_title() . '</option>';
            endwhile;
            wp_reset_postdata();
            ?>
        </select>
    </div>

    <input type="hidden" name="taxonomy" value="location">
    <input type="hidden" name="post_type" value="service">

    <button type="submit" class="search-btn btn--lg">Отправить</button>
</form>

Объяснение кода

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

2. Выпадающий список для услуг: Создается стандартный HTML-элемент <select>, в который включается опция Все услуги с пустым значением. Это позволяет пользователям выбрать все услуги без конкретного фильтра.

3. Цикл по пользовательским записям: С помощью объекта WP_Query выбираются все пользовательские записи типа ‘service’, затем каждая запись выводится в формате <option>.

4. Сброс данных: После завершения цикла по записям вызывается wp_reset_postdata(), чтобы восстановить оригинальные глобальные переменные.

Заключение

Реализовать выпадающие списки с опциями "Все" для пользовательских типов записей несложно. Данный подход обеспечивает дружелюбный интерфейс для пользователей и улучшает удобство работы с фильтрами. Убедитесь, что ваша форма адаптирована к специфике вашего проекта и соответствуют стандартам UX/UI для достижения лучших результатов.