WordPress at Your Fingertips

wp_dropdown_categories() WP 2.1.0

Display or retrieve the HTML dropdown list of categories. Instead of categories you can specify the name of an custom taxonomy.

The 'hierarchical' argument, which is disabled by default, will override the depth argument, unless it is true. When the argument is false, it will display all of the categories. When it is enabled it will use the value in the 'depth' argument.

Hooks from the function

Return

String. HTML code of the category drop-down list (<select>).

Usage Template
$args = array(
	'show_option_all'    => '',
	'show_option_none'   => '',
	'option_none_value'  => -1,
	'orderby'            => 'ID',
	'order'              => 'ASC',
	'show_last_update'   => 0,
	'show_count'         => 0,
	'hide_empty'         => 1,
	'child_of'           => 0,
	'exclude'            => '',
	'echo'               => 1,
	'selected'           => 0,
	'hierarchical'       => 0,
	'name'               => 'cat',
	'id'                 => 'name',
	'class'              => 'postform',
	'depth'              => 0,
	'tab_index'          => 0,
	'taxonomy'           => 'category',
	'hide_if_empty'      => false,
	'value_field'        => 'term_id', // field to set as option value
	'required'           => false,
);

wp_dropdown_categories( $args );

Usage

wp_dropdown_categories( $args );

In addition to following parameters, you can also specify any from get_terms().

$args(array|string)

Array or string of arguments to generate a categories drop-down element. See WP_Term_Query::__construct() for information on additional accepted arguments.

Default: ''

  • show_option_all(string)
    Text to display for showing all categories.
    Default: ''

  • show_option_none(string)
    Text to display for showing no categories.
    Default: ''

  • option_none_value(string)
    Value to use when no category is selected.
    Default: ''

  • orderby(string)
    Which column to use for ordering categories. See get_terms() for a list of accepted values. (term_id).
    Default: 'id'

  • pad_counts(true|false)
    See get_terms() for an argument description.
    Default: false

  • show_count(true|false|int)
    Whether to include post counts. Accepts 0, 1, or their bool equivalents.

  • echo(true|false|int)
    Whether to echo or return the generated markup. Accepts 0, 1, or their bool equivalents.
    Default: 1

  • hierarchical(true|false|int)
    Whether to traverse the taxonomy hierarchy. Accepts 0, 1, or their bool equivalents.

  • depth(int)
    Maximum depth.

  • tab_index(int)
    Tab index for the select element.
    Default: 0 (no tabindex)

  • name(string)
    Value for the 'name' attribute of the select element.
    Default: 'cat'

  • id(string)
    Value for the 'id' attribute of the select element.
    Default: value of $name

  • class(string)
    Value for the 'class' attribute of the select element.
    Default: 'postform'

  • selected(int|string)
    Value of the option that should be selected.

  • value_field(string)
    Term field that should be used to populate the 'value' attribute of the option elements. Accepts any valid term field: 'term_id', 'name', 'slug', 'term_group', 'term_taxonomy_id', 'taxonomy', 'description', 'parent', 'count'.
    Default: 'term_id'

  • taxonomy(string|array)
    Name of the taxonomy or taxonomies to retrieve.
    Default: 'category'

  • hide_if_empty(true|false)
    True to skip generating markup if no categories are found.
    Default: false (create select element even if no categories are found)

  • required(true|false)
    Whether the <select> element should have the HTML5 'required' attribute.
    Default: false

Examples

#1 Dropdown list with Submit button

Example output of category dropdown list with Submit button:

<h2>Categories:</h2>
<form action="<?php bloginfo('url'); ?>" method="get">
	<?php wp_dropdown_categories('show_count=1&hierarchical=1'); ?>
	<input type="submit" name="submit" value="view"/>
</form>

#2 Javascript dropdown list (no Submitt button)

An example showing the use of the show_option_none argument:

<h2>Categories:</h2>
<?php wp_dropdown_categories('show_option_none=Select categories'); ?>

<script>
	var dropdown = document.getElementById("cat");
	function onCatChange() {
		if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
			location.href = "<?php echo get_option('home');
?>/?cat="+dropdown.options[dropdown.selectedIndex].value;
		}
	}
	dropdown.onchange = onCatChange;
</script>

#3 Dropdown list using Javascript (2) (no Submit button)

<h2><?php _e('Posts by Category'); ?></h2>
<form action="<?php bloginfo('url'); ?>/" method="get">
	<div>
	<?php
	$select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0');
	$select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
	echo $select;
	?>
		<noscript><div><input type="submit" value="View" /></div></noscript>
	</div>
</form>

#4 Add the multiple parameter

// This filter allow a wp_dropdown_categories select to return multiple items
add_filter( 'wp_dropdown_cats', 'willy_wp_dropdown_cats_multiple', 10, 2 );
function willy_wp_dropdown_cats_multiple( $output, $r ) {

	if ( ! empty( $r['multiple'] ) ) {
		$output = preg_replace('/<select(.*?)>/i', '<select$1 multiple="multiple">', $output );
		$output = preg_replace('/name=([\"]{1})(.*?)\1/i', 'name=$2[]', $output );
	}

	return $output;
}

Now we use a function with the multiple parameter

wp_dropdown_categories( [
	'taxonomy' => 'category',
	'multiple' => true,
	'selected' => '10, 12', // selected terms
	'hide_empty' => false,
] );

We get:

Original code found here.

Changelog

Since 2.1.0 Introduced.
Since 4.2.0 Introduced the value_field argument.
Since 4.6.0 Introduced the required argument.

Code of wp_dropdown_categories() WP 5.8.1

function wp_dropdown_categories( $args = '' ) {
	$defaults = array(
		'show_option_all'   => '',
		'show_option_none'  => '',
		'orderby'           => 'id',
		'order'             => 'ASC',
		'show_count'        => 0,
		'hide_empty'        => 1,
		'child_of'          => 0,
		'exclude'           => '',
		'echo'              => 1,
		'selected'          => 0,
		'hierarchical'      => 0,
		'name'              => 'cat',
		'id'                => '',
		'class'             => 'postform',
		'depth'             => 0,
		'tab_index'         => 0,
		'taxonomy'          => 'category',
		'hide_if_empty'     => false,
		'option_none_value' => -1,
		'value_field'       => 'term_id',
		'required'          => false,
	);

	$defaults['selected'] = ( is_category() ) ? get_query_var( 'cat' ) : 0;

	// Back compat.
	if ( isset( $args['type'] ) && 'link' === $args['type'] ) {
		_deprecated_argument(
			__FUNCTION__,
			'3.0.0',
			sprintf(
				/* translators: 1: "type => link", 2: "taxonomy => link_category" */
				__( '%1$s is deprecated. Use %2$s instead.' ),
				'<code>type => link</code>',
				'<code>taxonomy => link_category</code>'
			)
		);
		$args['taxonomy'] = 'link_category';
	}

	// Parse incoming $args into an array and merge it with $defaults.
	$parsed_args = wp_parse_args( $args, $defaults );

	$option_none_value = $parsed_args['option_none_value'];

	if ( ! isset( $parsed_args['pad_counts'] ) && $parsed_args['show_count'] && $parsed_args['hierarchical'] ) {
		$parsed_args['pad_counts'] = true;
	}

	$tab_index = $parsed_args['tab_index'];

	$tab_index_attribute = '';
	if ( (int) $tab_index > 0 ) {
		$tab_index_attribute = " tabindex=\"$tab_index\"";
	}

	// Avoid clashes with the 'name' param of get_terms().
	$get_terms_args = $parsed_args;
	unset( $get_terms_args['name'] );
	$categories = get_terms( $get_terms_args );

	$name     = esc_attr( $parsed_args['name'] );
	$class    = esc_attr( $parsed_args['class'] );
	$id       = $parsed_args['id'] ? esc_attr( $parsed_args['id'] ) : $name;
	$required = $parsed_args['required'] ? 'required' : '';

	if ( ! $parsed_args['hide_if_empty'] || ! empty( $categories ) ) {
		$output = "<select $required name='$name' id='$id' class='$class' $tab_index_attribute>\n";
	} else {
		$output = '';
	}
	if ( empty( $categories ) && ! $parsed_args['hide_if_empty'] && ! empty( $parsed_args['show_option_none'] ) ) {

		/**
		 * Filters a taxonomy drop-down display element.
		 *
		 * A variety of taxonomy drop-down display elements can be modified
		 * just prior to display via this filter. Filterable arguments include
		 * 'show_option_none', 'show_option_all', and various forms of the
		 * term name.
		 *
		 * @since 1.2.0
		 *
		 * @see wp_dropdown_categories()
		 *
		 * @param string       $element  Category name.
		 * @param WP_Term|null $category The category object, or null if there's no corresponding category.
		 */
		$show_option_none = apply_filters( 'list_cats', $parsed_args['show_option_none'], null );
		$output          .= "\t<option value='" . esc_attr( $option_none_value ) . "' selected='selected'>$show_option_none</option>\n";
	}

	if ( ! empty( $categories ) ) {

		if ( $parsed_args['show_option_all'] ) {

			/** This filter is documented in wp-includes/category-template.php */
			$show_option_all = apply_filters( 'list_cats', $parsed_args['show_option_all'], null );
			$selected        = ( '0' === (string) $parsed_args['selected'] ) ? " selected='selected'" : '';
			$output         .= "\t<option value='0'$selected>$show_option_all</option>\n";
		}

		if ( $parsed_args['show_option_none'] ) {

			/** This filter is documented in wp-includes/category-template.php */
			$show_option_none = apply_filters( 'list_cats', $parsed_args['show_option_none'], null );
			$selected         = selected( $option_none_value, $parsed_args['selected'], false );
			$output          .= "\t<option value='" . esc_attr( $option_none_value ) . "'$selected>$show_option_none</option>\n";
		}

		if ( $parsed_args['hierarchical'] ) {
			$depth = $parsed_args['depth'];  // Walk the full depth.
		} else {
			$depth = -1; // Flat.
		}
		$output .= walk_category_dropdown_tree( $categories, $depth, $parsed_args );
	}

	if ( ! $parsed_args['hide_if_empty'] || ! empty( $categories ) ) {
		$output .= "</select>\n";
	}

	/**
	 * Filters the taxonomy drop-down output.
	 *
	 * @since 2.1.0
	 *
	 * @param string $output      HTML output.
	 * @param array  $parsed_args Arguments used to build the drop-down.
	 */
	$output = apply_filters( 'wp_dropdown_cats', $output, $parsed_args );

	if ( $parsed_args['echo'] ) {
		echo $output;
	}

	return $output;
}

List (wp_list)

Categories

Taxonomies (category, tag)

No comments
    Log In