Как на Wordpress сделать вывод иерархического древовидного выпадающего вертикального списка рубрик?

Question

[Дамир Шамарданов]

Здравствуйте!
Помогите, пожалуйста с проблемой. Нужно в сайдбаре (виджетах) сайта на WP вывести вертикальный список рубрик. Только, что бы он был выпадающий иерархический. У меня сотни рубрик, так что вручную делать не вариант. Количество записей в каждой рубрике совсем не обязательно.
Перебрал кучу плагинов, не подошёл ни один...
Буду рад решению в php, так как можно этот код вставить в виджет PHP-код.

Answer 1

[Андрей]

Обновил

<select name="category" id="category-select">
    <option value="">Выберите из списка</option>
    <?php
    $categories = get_terms(array(
        'taxonomy'   => 'category',
        'hide_empty' => false,
        'orderby'    => 'term_order', 
        'order'      => 'ASC',
    ));

   
    function display_category_options($categories, $parent = 0, $depth = 0) {
        foreach ($categories as $category) {
            if ($category->parent == $parent) {
                $indent = str_repeat('&nbsp;', $depth * 4); 
                echo '<option value="' . esc_url(get_category_link($category->term_id)) . '">' . $indent . esc_html($category->name) . '</option>';
                display_category_options($categories, $category->term_id, $depth + 1); 
            }
        }
    }

    display_category_options($categories);
    ?>
</select>

<script>
document.getElementById('category-select').addEventListener('change', function() {
    const selectedValue = this.value;
    if (selectedValue) {
        window.location.href = selectedValue; 
    }
});
</script>

Comments

[Дамир Шамарданов]

Спасибо, Андрей ! Близко, но не совсем то. Так как рубрики видны. Я же хотел, что бы по клику появлялись рубрики.
Как на скрине.

[Андрей]

Дамир Шамарданов,

<select name="category" id="category-select">
    <option value="">Выберите из списка</option>
    <?php
    $categories = get_categories(array(
        'orderby' => 'name',
        'order'   => 'ASC',
        'hide_empty' => false, // Показывать даже те категории, в которых нет записей  true, false
    ));

    foreach ($categories as $category) {
        echo '<option value="' . esc_attr($category->term_id) . '">' . esc_html($category->name) . '</option>';
    }
    ?>
</select>

или так

<select name="category" id="category-select">
    <option value="">Выберите из списка</option>
    <?php
    $categories = get_categories(array(
        'orderby' => 'name',
        'order'   => 'ASC',
        'hide_empty' => false,
        'hierarchical' => true, // Включаем иерархию
    ));

    foreach ($categories as $category) {
        $indent = str_repeat('&nbsp;', $category->parent ? 4 : 0); // Добавляем отступ для подкатегорий
        echo '<option value="' . esc_attr($category->term_id) . '">' . $indent . esc_html($category->name) . '</option>';
    }
    ?>
</select>

[Дамир Шамарданов]

Андрей, второй вариант - это, что надо, но не происходит перехода на рубрику. Вообще перехода нет. Понимаю, что я не сказал про это в вопросе. Но без перехода на страницу с рубрикой это всего лишь хороший иерархический список. Поможете с переходами?

[Андрей]

Дамир Шамарданов, Должно работать
по крайней мере у меня работает
я втыкаю прямо в шаблон а не через виджеты

<select name="category" id="category-select">
    <option value="">Выберите из списка</option>
    <?php
    $categories = get_categories(array(
        'orderby' => 'name',
        'order'   => 'ASC',
        'hide_empty' => false,
        'hierarchical' => true,
    ));

    foreach ($categories as $category) {
        $indent = str_repeat('&nbsp;', $category->parent ? 4 : 0);
        echo '<option value="' . esc_url(get_category_link($category->term_id)) . '">' . $indent . esc_html($category->name) . '</option>';
    }
    ?>
</select>

<script>
document.getElementById('category-select').addEventListener('change', function() {
    const selectedValue = this.value;
    if (selectedValue) {
        window.location.href = selectedValue; 
    }
});
</script>

[Дамир Шамарданов]

Андрей, БЛАГОДАРЮ!!!
Это отличное решение!!!

[Дамир Шамарданов]

Андрей, прошу прощения, но тут иерархия не по разделам... А по буквам. То есть смешались рубрики. Сначала идут все на А. Первая - как основная, а затем все остальные на А. Потом идёт иерархия на Б. И так далее.

[Дамир Шамарданов]

Андрей, то есть получается вот так.