Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

(Moderator's note: The original title was "drop down taxonomy")

I want to add a drop-down box filled with my custom taxonomies, so when someone selects any value, it redirects to corresponding page. I tried out this code, which worked

<?php wp_dropdown_categories( array( 'taxonomy' => 'name of taxonomy' ) ); ?>

The problem is I want a the page to redirect without the user needing to press any buttons. How can I do this?

this question was resolved but i want to modify further, i want to add a shortcode, so that i can also call drop-down-list into my post, i tried this but not working add_shortcode('drop','the_taxonomy_dropdown');

but when i call this in my post [drop="location"] its not working, whats the problem?

share|improve this question
    
The shortcode issue was discussed in the chat room, first in the general room, then in a specific room. –  Jan Fabry Dec 20 '10 at 11:34
add comment

2 Answers 2

up vote 1 down vote accepted

Hi @ntechi:

Here's a function I wrote which I named the_taxonomy_dropdown() to give you what I think you are looking for.

function the_taxonomy_dropdown($taxonomy) {
  $id = "{$taxonomy}-dropdown";
  $js =<<<SCRIPT
<script type="text/javascript">
 jQuery(document).ready(function($){
  $("select#{$id}").change(function(){
    window.location.href = $(this).val();
  });
 });
</script>
SCRIPT;
  echo $js;
  $terms = get_terms($taxonomy);
  echo "<select name=\"{$id}\" id=\"{$id}\">";
  foreach($terms as $term) {
    echo '<option value="';
    echo get_term_link(intval($term->term_id),$taxonomy);
    echo '">' . "{$term->name}</option>";
  }
  echo "</select>";
}

You can put the_taxonomy_dropdown() in your theme's functions.php file and call it from one of your theme's template files like so:

<?php the_taxonomy_dropdown('name of taxonomy'); ?>

Notice I didn't use wp_dropdown_categories() because it sets the <option>'s values to term_id instead of the term's permalink. You need the permalink in order to set the window.location.href on the client end. Had we used wp_dropdown_categories() it have would added more complexity; it would have required issuing an HTTP GET request with term_id to a page on the server that would then redirect to the term's permalink. But it's much easier to just build the HTML <select> ourselves as I did (and it's more peformant, since it doesn't take an extra HTTP request.)

Of course, be sure to remember wp_enqueue_script() jQuery in an 'init' hook, also in your theme's functions.php file:

add_action('init','jquery_init');
function jquery_init() {
  wp_enqueue_script('jquery');
}
share|improve this answer
    
hey thanks its working but i have one more question, i want this to be displayed on my home page, but my home page is not a static page, how can i do that?? i tried to put a <div> tag in index.php but it is matching with my page, do you have any idea how can i do that? –  ntechi Dec 4 '10 at 9:30
    
@ntechi - Just put <?php the_taxonomy_dropdown('name of taxonomy'); ?> in your index.php just like you would with any theme template file, no need for a <div>. Or are you asking about CSS or layout? If your question is about CSS or layout that's a question for webmasters.stackexchange.com –  MikeSchinkel Dec 4 '10 at 9:44
    
might be a css question, but just check this image i55.tinypic.com/bgvkgx.jpg in this image check the hello text, it is not coming as the next post is coming i mean that it should be wrapped into a box just like the post, how can i do that? –  ntechi Dec 4 '10 at 9:48
    
@ntechi - I'm sorry, I do not understand your problem. It seems I answered your main question but now you are asking about something different? If so you really need to post a new question, not ask other questions as follow up. I think this is the second time you've asked me a different follow up question in the comments so I think it's fair of me to mention etiquette here (next comment.) –  MikeSchinkel Dec 4 '10 at 10:01
2  
(from previous comment.) It's not very courteous to make the person who went to all the effort to write up a nice long answer to feel obligated to answer all your follow up questions on other topics. We are here to write one good answer per page, not to open a one-on-one free support service for others who are getting paid by their clients (you can, of course, hire and pay some of us if you really need that level of support. :-) I hope you don't take this as me being rude but maybe you are not aware that we are all just volunteers giving freely of our own limited spare time? –  MikeSchinkel Dec 4 '10 at 10:02
show 4 more comments

I was looking at this problem again today, that is, the dropdown element returned by wp_dropdown_categories() setting option values to the term's ID..

Now whilst this makes the dropdown a little useless for filter dropdowns or jump menus, it is actually possible to rejiggle the JS used so it works "as is"...

Here's a basic example, which is based on the code posted above.

function the_taxonomy_dropdown( $taxonomy = '', $query_var = '' ) {

    if( empty( $taxonomy ) )
        return;

    if( empty( $query_var ) )
        $query_var = $taxonomy;

    $select_id = "{$taxonomy}-dropdown";
    $url_base = get_bloginfo('url') . "/$query_var/";
    ?>

    <script type="text/javascript">
    jQuery(document).ready(function($){
        $("select#<?php echo $select_id; ?>").change(function(){
            var term = this.options[this.selectedIndex].text;
            window.location.href = "<?php echo $url_base; ?>" + term;
        });
    });
    </script>

    <?php
    wp_dropdown_categories( array( 'taxonomy' => $taxonomy, 'id' => $select_id ) );
}

NOTE: This examples JS assumes you are using pretty permalinks.

If your taxonomy uses a query var that differs to the taxonomy slug you pass into the function, simply add the query var as the second parameter..

the_taxonomy_dropdown( 'post_tag', 'tag' );

Please note, this is just an example to show you how to work around the issue with wp_dropdown_categories and custom taxonomies by making changes to the JS.

Also for reference, there's a ticket here that was due for a patch. http://core.trac.wordpress.org/ticket/13258

share|improve this answer
    
ok, but how can i get two taxonomies drop-down box, what i want is when a user comes to my site, he will select one value from first drop-down then second value from second drop-down and when the user will hit search, then it should search the posts and give the display of the posts which contains the keyword –  ntechi Dec 10 '10 at 14:44
    
You'd place the two select boxes into a form and add a submit button (ya know, like a search form). Not that i think that will work, i don't think it's possible to query two custom taxonomies at once, not using GET requests at least.. –  t31os Dec 10 '10 at 14:53
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.