Dropdown with category selection

Here is a variation of the code that you use. I’m using get_categories() here to achieve the same goal. I had to adjust my code slightly to make it acceptable for your need.

There are a however other modifications you have to make for this to work. When you select the All Categories option, you will be taken to a page that will display what ever you need to display. This page you will have to manually create

There is no index archive pages in WordPress as you might know. (Check out this post I have done on the same subject). What this means is, domain.com/category/ returns a 404.

So, to make this all work, you’ll have to make a copy of page.php, rename it to something like page-category.php (see the codex on how to create custom page templates), open it up, create your custom query to display what you would like to display when this page is visited

You now need to create your page in the back end. I would suggest that you use the slug category so that when you visit domain.com/category/, this page would be displayed. (Just remember, you cannot create child pages for this page, it will break the hierarchy). I have also made the code to go to domain.com/category/ when All Categories is selected

Apart from that, the code should work fine. You just need to check the URL structures maybe, and also set the parameters in get_categories() to suite your needs. Here is the drop down code.

<select name="event-dropdown" onchange="document.location.href=this.options[this.selectedIndex].value;"> 
    <option value=""><?php echo esc_attr(__('Select Category')); ?></option> 

    <?php 
        $option = '<option value="' . get_option('home') . '/category/">All Categories</option>'; // change category to your custom page slug
        $categories = get_categories(); 
        foreach ($categories as $category) {
            $option .= '<option value="'.get_option('home').'/category/'.$category->slug.'">';
            $option .= $category->cat_name;
            $option .= ' ('.$category->category_count.')';
            $option .= '</option>';
        }
        echo $option;
    ?>
</select>

EDIT

I actually had an idea here that will come in handy. I’ve recently done an answer on displaying all categories in a list with all post titles under the specific category. This same idea can be used in your page-category.php template.

When a user selects the All Categories option, they will be taken to this page which will list all categories and post title.

Here is the complete code: (for an explanation of the code, see my post here)

In your functions.php

add_action( 'transition_post_status', 'publish_new_post', 10, 3 );

function publish_new_post() {
   delete_transient( 'category_list' );
}

In your template where you need to display your list

<?php
if ( false === ( $q = get_transient( 'category_list' ) ) ) {

    $args = array( 
        'posts_per_page' => -1
    );

    $query = new WP_Query($args); 

    $q = array();

    while ( $query->have_posts() ) { 

        $query->the_post(); 

        $a="<a href="". get_permalink() .'">' . get_the_title() .'</a>';

        $categories = get_the_category();

        foreach ( $categories as $key=>$category ) {

            $b = '<a href="' . get_category_link( $category ) . '">' . $category->name . '</a>';    

        }

        $q[$b][] = $a; // Create an array with the category names and post titles
    }


    /* Restore original Post Data */
    wp_reset_postdata();

set_transient( 'category_list', $q, 12 * HOUR_IN_SECONDS );
}

foreach ($q as $key=>$values) {
        echo $key;

        echo '<ul>';
            foreach ($values as $value){
                echo '<li>' . $value . '</li>';
            }
        echo '</ul>';
    }


?>