Create a dropdown of custom taxonomies in WordPress (the easy way) — Frankie Jarrett | WordPress developer. Web geek. Jesus freak.

So you’ve been busy taking advantage of custom post type functionalities in WordPress since mid 2010. And of course you’re using custom taxonomies too, right? Of course you are.

If you’re a theme or plugin developer you may have ran across the need to populate a dropdown list of your custom taxonomies. Essentially there are two different (easy) ways to accomplish this. One you always hear about and the other you don’t.

Method #1

Since WP 2.1 the wp_dropdown_categories function has been around but in WP 3.0 the taxonomy argument was introduced. So just calling this function and using the taxonomy argument is probably the absolute easiest way to populate a dropdown list of your custom taxonomies.

<?php wp_dropdown_categories( 'taxonomy=my_custom_taxonomy' ); ?>

This method is great if you need the output of your dropdown values to be the category ID. Because this is the HTML that will be generated:

<select name="cat" class="postform">
	<option value="3">Tax A</option>
	<option value="14">Tax B</option>
	<option value="26">Tax C</option>
	<option value="29">Tax D</option>
</select>

However, let’s say you want your option value output to be the taxonomy’s slug instead of the ID. Well, that’s impossible to achieve using the wp_dropdown_categories function.

Peering into the WordPress core we see that this function is using a walker class called Walker_CategoryDropdown. This walker is designed to output only the ID as the value for each dropdown item. There is not an argument in the function to control value output.

Method #2

That’s where Method #2 comes in. We’ll have to write our own custom function that will generate the dropdown so we can output each option value as a slug:

function fjarrett_custom_taxonomy_dropdown( $taxonomy ) {
	$terms = get_terms( $taxonomy );
	if ( $terms ) {
		printf( '<select name="%s" class="postform">', $taxonomy );
		foreach ( $terms as $term ) {
			printf( '<option value="%s">%s</option>', $term->slug, $term->name );
		}
		print( '</select>' );
	}
}

So, now that we’ve got a cool custom function, we can call anywhere in our code like so:

<?php fjarrett_custom_taxonomy_dropdown( 'my_custom_taxonomy' ); ?>

Expansions on Method #2

If you’re a coding rockstar you can take Method #2 even further by making room for more parameters. This will give you even more control and make it function more like wp_dropdown_categories does:

function fjarrett_custom_taxonomy_dropdown( $taxonomy, $orderby = 'date', $order = 'DESC', $limit = '-1', $name, $show_option_all = null, $show_option_none = null ) {
	$args = array(
		'orderby' => $orderby,
		'order' => $order,
		'number' => $limit,
	);
	$terms = get_terms( $taxonomy, $args );
	$name = ( $name ) ? $name : $taxonomy;
	if ( $terms ) {
		printf( '<select name="%s" class="postform">', $name );
		if ( $show_option_all ) {
			printf( '<option value="0">%s</option>', $show_option_all );
		}
		if ( $show_option_none ) {
			printf( '<option value="-1">%s</option>', $show_option_none );
		}
		foreach ( $terms as $term ) {
			printf( '<option value="%s">%s</option>', $term->slug, $term->name );
		}
		print( '</select>' );
	}
}

Then call it in your code like so:

<?php fjarrett_custom_taxonomy_dropdown( 'my_custom_taxonomy', 'date', 'DESC', '5', 'my_custom_taxonomy', 'Select All', 'Select None' ); ?>

Conclusion

As you can see, WordPress has done a fabulous job of making room for you and I to do pretty much whatever we want.

To reference all available arguments and parameters, please see:
http://codex.wordpress.org/Function_Reference/wp_dropdown_categories
http://codex.wordpress.org/Function_Reference/get_terms

Was this code helpful to you? Let me know in the comments!

15 thoughts on “Create a dropdown of custom taxonomies in WordPress (the easy way)”

This works great for listing custom taxonomies but I’m having trouble getting it to submit once a selection is made.

Any help would be greatly appreciated.

Thanks!

Reply ↓

Tim, sounds like this could be an issue with the form you’re using to wrap this dropdown element. Send me a link and I’ll check it out.

//Frankie

Reply ↓

Tim on November 8, 2011 at 11:02 am said:
Hi Frankie.

Thanks for the tutorial.

I think I’m having the same problem as the other Tim – the dropdown is populated OK but it doesn’t submit when an item is selected.

This is the code that I’m trying to use – a combination of your tutorial and the wp_dropdown_categories() tutorial I found in the Codex:
```
<form action="/" method="get">
```
Can you point me in the right direction?

Thanks,

Tim
Reply ↓
- Frankie on November 8, 2011 at 3:45 pm said:
  
  Hi, Tim. I’d be happy to help. Ok, it depends on what function you want to perform.
  
  Are you using it to do a search on the front-end?
  
  Or are you using it in the WP Admin?
  
  //Frankie

Wow, this post was very helpful! I can’t believe how long it took me to figure out a dropdown for custom taxonomies…

Someone was asking about how to get the form to submit, so you may want to complete this tutorial by adding the complete function that wordpress devs should add to their functions.php

For me this was:

function custom_taxonomy_dropdown($taxonomy, $name, $show_option_all) { ?>
	<form action="" method="get">
	 $orderby,
		'order' => $order,
		'number' => $limit
	);
	$terms = get_terms($taxonomy, $args);
	echo '';
	if($show_option_all) echo ''.$show_option_all.'';
	if($show_option_none) echo ''.$show_option_none.'';
	foreach ($terms as $term) {
		echo 'slug.'">'.$term->name.'';
	}
	echo '';
	?>
<?php }

Reply ↓

Apparently you’re the only person who cares to post a simple, useful tutorial. THANK YOU! I’ve been testing different tutorials until my eyes were red. Your code did the trick without any complications!

Reply ↓

Frankie on February 3, 2012 at 5:21 pm said:

Great to hear! Thanks, Nathan.

Reply ↓

This is working excellently. I am trying to add a ‘All’ option to the select, to filter to all taxonomies.

function custom_taxonomy_dropdown($taxonomy) {
	$terms = get_terms($taxonomy);
	echo '';
		echo 'All';
	foreach ($terms as $term) {
		echo 'slug.'">'.$term->name.'';
	}
	echo '';
}

I’m guessing value="0" isn’t correct. Any ideas?

Reply ↓

Frankie on February 14, 2012 at 4:14 pm said:

Hey Michael, thanks for your comment.

The wp_dropdown_categories() function outputs value="0" for the show_option_all argument, so this should work.

Have you tried the Expansions on Method #2 example above?

//Frankie

Reply ↓

Thanks bud,

just had a look at the second method, and it seemed to work perfectly until I tried the select all option, which in effect does work, it shows all ‘posts’. Im using this script for a custom post type archive page, attempting to show a dropdown menu of the custom taxonomies.

Here is the code thats in my archive page…

and here is the function…

function custom_taxonomy_dropdown($taxonomy, $orderby, $order, $limit, $name, $show_option_all) {
	$args = array(
		'orderby' => $orderby,
		'order' => $order,
		'number' => $limit
	);
	$terms = get_terms($taxonomy, $args);
	echo '';
	if($show_option_all) echo ''.$show_option_all.'';
	if($show_option_none) echo ''.$show_option_none.'';
	foreach ($terms as $term) {
		echo 'slug.'">'.$term->name.'';
	}
	echo '';
}

The value="0" shows all the posts, but none of the custom post pages, all of the others work perfectly. Any ideas?

On a side note, someone asked about it submitting the form without a button, just add onchange="this.form.submit();" to the select element, works perfectly

Reply ↓

Hi Frankie,

is there a way to display more than one select box, each one for a different taxonomy in order to filter posts by multiple criteria..

Thank you

Dimitri

Reply ↓

How can this be applied to pages? In the codex there is an example of how to get a dropdown for categories and have it go to the selection without having a submit button. But I can’t get the same method to work for the page dropdown code provided in the codex. Any ideas?

Reply ↓

Frankie Jarrett on May 18, 2012 at 11:50 am said:

Hi Kahil, Perhaps I will take a look at that issue and write a separate blog post. This post was intended for working with custom taxonomies only.

Reply ↓
- Kahil on May 18, 2012 at 12:07 pm said:
  
  Thank you… been trying to figure that out for days now without any success. Please feel free to email me a possible solution if you’d like.
  
  Thanks
- Frankie Jarrett on May 18, 2012 at 12:09 pm said:
  
  If/when I post a solution it will be for everyone to see.

Method #1

Method #2

Expansions on Method #2

Conclusion

15 thoughts on “Create a dropdown of custom taxonomies in WordPress (the easy way)”

Leave a Reply Cancel reply