wp_dropdown_categories( array|string $args = '' ): string

User Contributed Notes

1. Skip to note 10 content

   hearvox 10 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 3You must log in to vote on the helpfulness of this note

   This example displays a category dropdown list using JavaScript instead of a submit button, with a no-selection option (labeled: “Select category”):

   <h2><?php _e( 'Posts by Category', 'textdomain' ); ?></h2>
   	<?php wp_dropdown_categories( 'show_option_none=Select category' ); ?>
   <script type="text/javascript">
   	<!--
   	var dropdown = document.getElementById("cat");
   	function onCatChange() {
   		if ( dropdown.options[dropdown.selectedIndex].value > 0 ) {
   			location.href = "<?php echo esc_url( home_url( '/' ) ); ?>?cat="+dropdown.options[dropdown.selectedIndex].value;
   		}
   	}
   	dropdown.onchange = onCatChange;
   	-->
   </script>
2. Skip to note 11 content

   hearvox 10 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 3You must log in to vote on the helpfulness of this note

   By default, wp_dropdown_categories only returns categories that have been assigned to at least one post. To override this set the hide_empty parameter to false ("0").

   <?php wp_dropdown_categories( 'hide_empty=0' ); ?>
3. Skip to note 12 content

   hearvox 10 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   In this example the echo parameter (echo=0) is used. A simple preg_replace inserts the JavaScript code. It even works without JavaScript (submit button is wrapped by noscript tags).

   <h2><?php _e( 'Posts by Category', 'textdomain' ); ?></h2>
   <form id="category-select" class="category-select" action="<?php echo esc_url( home_url( '/' ) ); ?>" method="get">
   
   	<?php
   	$args = array(
   		'show_option_none' => __( 'Select category', 'textdomain' ),
   		'show_count'       => 1,
   		'orderby'          => 'name',
   		'echo'             => 0,
   	);
   	?>
   
   	<?php $select  = wp_dropdown_categories( $args ); ?>
   	<?php $replace = "<select$1 onchange='return this.form.submit()'>"; ?>
   	<?php $select  = preg_replace( '#<select([^>]*)>#', $replace, $select ); ?>
   
   	<?php echo $select; ?>
   
   	<noscript>
   		<input type="submit" value="View" />
   	</noscript>
   
   </form>
4. Skip to note 13 content

   ayandebnath 9 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   You can use Walker with this wp_dropdown_categories function.

   Example –

   class Walker_custom_CategoryDropdown extends Walker_CategoryDropdown {
   
   	public function start_el( &$output, $category, $depth = 0, $args = array(), $id = 0 ) {
   		$pad = str_repeat(' ', $depth * 3);
    
   		/** This filter is documented in wp-includes/category-template.php */
   		$cat_name = apply_filters( 'list_cats', $category->name, $category );
    
   		if ( isset( $args['value_field'] ) && isset( $category->{$args['value_field']} ) ) {
   			$value_field = $args['value_field'];
   		} else {
   			$value_field = 'term_id';
   		}
    
   		$output .= "\t<option class=\"level-$depth\" value=\"" . esc_attr( $category->{$value_field} ) . "\"";
    
   		// Type-juggling causes false matches, so we force everything to a string.
   		if ( (string) $category->{$value_field} === (string) $args['selected'] )
   			$output .= ' selected="selected"';
   		
   		$output .= ' data-uri="'.get_term_link($category).'" '; /* Custom */
   		
   		$output .= '>';
   		$output .= $pad.$cat_name;
   		if ( $args['show_count'] )
   			$output .= '&nbsp;&nbsp;('. number_format_i18n( $category->count ) .')';
   		$output .= "</option>\n";
   	}
   }
   
   $cat_arg=array(
   	'taxonomy'=> 'category',
   	'class' => 'form-control',
   	'value_field' => 'term_id',
   	'selected' => $taxonomy_id,
   	
   	'orderby' => 'name',
   	'show_count' => 0,
   	'hierarchical' => true,
   	'hide_if_empty' => true,
   	
   	'walker'  => new Walker_custom_CategoryDropdown()
   );
5. Skip to note 14 content

   Lucas 4 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   With the following example you add a selected to the current tag archive page.

   <?php
   $tag_slug = get_query_var( 'tag' );
   wp_dropdown_categories(array('taxonomy'=> 'post_tag', 'selected'=>$tag_slug, 'show_option_none'=> 'Select an option', 'hide_empty' => 0, 'name' => 'listofoptions', 'value_field' => 'slug' ));?>
   <script>
   document.getElementById('listofoptions').onchange = function(){
   window.location='/tag' + '/' +this.value
   }
   </script>
6. Skip to note 15 content

   nsei 6 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 1You must log in to vote on the helpfulness of this note

   With the following example, when category is selected, you can automatically redirect to the category detail page.

   <?php wp_dropdown_categories(); ?>
   
   <script>
     document.getElementById('cat').onchange = function(){
   	// if value is category id
       if( this.value !== '-1' ){
         window.location='/?cat='+this.value
       }
     }
   </script>
7. Skip to note 16 content

   markbranly 2 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 1You must log in to vote on the helpfulness of this note

   For anyone looking for the description for the pad_counts arg, it is found on the Constructor of WP_Term_Query.
8. Skip to note 17 content

   hearvox 10 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 0You must log in to vote on the helpfulness of this note

   Displays a hierarchical category dropdown list in an HTML select form with a submit button, with a count of posts in each category.

   <h2><?php _e( 'Categories:', 'textdomain' ); ?></h2>
   <form id="category-select" class="category-select" action="<?php echo esc_url( home_url( '/' ) ); ?>" method="get">
   	<?php wp_dropdown_categories( 'show_count=1&hierarchical=1' ); ?>
   	<input type="submit" name="submit" value="view" />
   </form>
9. Skip to note 18 content

   DrLightman 3 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: -2You must log in to vote on the helpfulness of this note

   It’s hide_empty NOT hide_if_empty!
   In the args’ Parameters list.

   • Both parameters exist as valid arguments.

     crstauf 3 years ago
   • Documentation is correct, there are 2 parameters: – hide_if_empty: to create or not the markup if there are no categories – hide_empty: to include or not categories with no posts attached

     GodsDeneuve 3 years ago