How to Add Category Drop down or Fetch Category List with Link in WordPress

How to Add Category Drop down or Fetch Category List with Link in WordPress

How to Add Category Dropdown or Fetch Category List with Link in WordPress

Code In header.php

 
        <div class="dropDownBlog">
         <?php
                    $categories = get_categories( array(
                        'orderby' => 'name',
                        'order'   => 'ASC'
                    ) );?>
                        <div class="fetchCategary">
                        <select id="blogPageCategaryFetch">      
                        <option disabled selected>Explore By Categary</option>
                  <?php   foreach( $categories as $category ) {
                        $category_link = sprintf( 
                            '<a href="%1$s" alt="%2$s">%3$s</a>',
                            esc_url( get_category_link( $category->term_id ) ),
                            esc_attr( sprintf( __( 'View all posts in %s', 'textdomain' ), $category->name ) ),
                            esc_html( $category->name )
                        );
                        
                    ?>
                       <?php echo '<option value= '.get_category_link( $category->term_id ) .'>' . $category_link. '</option> ';?>
                       
            
                   <?php  } 
                 ?>  
                            
                            
             </select>
                    </div>
                        
        </div>  

jQuery Code By Click Option in Select Dropdown menu for redirect page to selected WordPress category

 

    <script type="text/javascript">
            jQuery(document).ready(function(){
                
                jQuery('#blogPageCategaryFetch').change(function(){
                    
                    var getValueOption = jQuery(this).val();
                    
                    console.log(getValueOption);
                    
                    window.location.href = getValueOption; 
                    
                });
                
            });
        </script>