Combination of Category & Posts Drop Down

Hi,

I need some help here. I want to build a category drop down along with posts drop down such that when people select a category from the drop down, it will populate the posts drop down.

Currently there are 5 categories and I am using the following code but I don't know how to pass on the value of the currently browsing category to the wp_query. So I have created 5 category specific templates each having its own category id in the wp_query code.

For category drop down:

<form action="<?php bloginfo('url'); ?>/" method="get" style="display:inline;">
	<?php
	$select = wp_dropdown_categories('show_option_none=Select Episode&show_count=1&orderby=name&order=DESC&echo=0');
	$select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
	echo $select;
	?>
	<noscript><input type="submit" value="View" /></noscript>
</form>

And for the posts drop down:

<?php
	$postid = url_to_postid( get_permalink() );
	//$cat_id = get_cat_ID('episode-01');
	$args=array(
		'cat' => 3,
		'post_type' => 'post',
		'post_status' => 'publish',
		'posts_per_page' => -1,
		'orderby' => 'date',
		'order' => 'ASC'
	);
	$my_query = null;
	$my_query = new WP_Query($args);
	if( $my_query->have_posts() ) {
?>
	<form name="jump" style="display:inline;">
		<select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_top')">
			<?php
				while ($my_query->have_posts()) : $my_query->the_post();
				$mpostid = url_to_postid( get_permalink() );
			 ?>
				<option value="<?php the_permalink() ?>"<?php if($postid == $mpostid) echo " selected"; ?>><?php the_title(); ?></option>
			<?php
				endwhile;
			} ?>
		</select>
	</form>
<?php
	wp_reset_query();
?>

In short, I need to build a two level drop down such that when members select a category, the posts drop down will automatically get populated without having to create additional category specific templates. That way, if I create more categories, I don't have to worry about creating additional templates.

  • Alok Sharma

    @digisoft - Actually, I am using the same code from the link you mentioned.

    It does works but its giving unexpected results. For e.g. if I select category B from the drop down, it does populates all the post in the post drop down but when I select a post from the posts drop down, it takes me to the most recent post which is in category D.

    As for the category drop down, I think the exist code should do the needful.

    But I need to figure out how to insert the category id of the currently browsing posts dynamically in the wp_query code so that I don't have to create category specific templates.

    Any help will be highly appreciated.

  • digitsoft

    This should do it for you...seems to work for me...only change in the code is the first 2 lines.
    This only pulls the first category it comes to and as you probably know posts can have multiple categories.

    <?php
    $cat_id = get_the_category();
    $cat_id = get_cat_ID($cat_id[0]->cat_name);
    $args=array(
    'cat' => $cat_id,
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => -1,
    'caller_get_posts'=> 1
    );
    $my_query = null;
    $my_query = new WP_Query($args);
    if( $my_query->have_posts() ) {
    ?>
    <form name="jump">
    <select name="menu">
    <?php
    while ($my_query->have_posts()) : $my_query->the_post(); ?>
    <option value="<?php the_permalink() ?>"><?php the_title(); ?></option>
    <?php

    endwhile;
    }
    ?>
    </select>
    <input type="button" onClick="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="Go">
    </form>

    <?php
    wp_reset_query();
    ?>

  • Alok Sharma

    Never mind, I tried this out the way you mentioned it and it works great. For now, I won't have to create additional category specific templates as and when new categories are added.

    Just one small issue. When I select a category from the drop down, it always loads the most recent post and not the least recent post even after having the 'orderby' => 'date' & 'order' => 'ASC' parameters in wp_query. Any clues what could be wrong?

  • PC

    Hello Alok,

    I have had a look at the question for you.

    When I select a category from the drop down, it always loads the most recent post and not the least recent post even after having the 'orderby' => 'date' & 'order' => 'ASC' parameters in wp_query.

    That is the default behavior of the post display page.

    If you have noticed, when you select any category from the dropdown list, it would take to to some page like yourdomain.com/blog/category/free-website-hosting-services/ (Or something else as per your setup)

    Now, the below code

    'orderby'            => 'date',
        'order'              => 'ASC',

    Is not to change the order in which the posts are displayed, but to change the order in which the categories appear in the drop down.

    I hope that makes it clear for you.

    Please advise

    Cheers
    PC

  • Alok Sharma

    Sorry for not mentioning it clearly, but I am already using this code:

    <?php
    	$postid = url_to_postid( get_permalink() );
    	$cat_id = get_the_category();
    	$cat_id = get_cat_ID($cat_id[0]->cat_name);
    	$args=array(
    		'cat' => $cat_id,
    		'post_type' => 'post',
    		'post_status' => 'publish',
    		'posts_per_page' => -1,
    		'orderby' => 'date',
    		'order' => 'ASC'
    	);
    	$my_query = null;
    	$my_query = new WP_Query($args);
    	if( $my_query->have_posts() ) {
    ?>

    Still it shows the latest post 1st.

  • PC

    Hello Alok,

    I have added the below code to the category.php and it looks good.

    <?php /* Reverse the sort order ascending */ ?>
    <?php query_posts($query_string . "&order=ASC"); ?>

    Add the above code before this one

    <?php if ( ! have_posts() ) : ?>

    And It would reverse the order of post display on category archives.

    I would recommend you to take a backup before you modify the file.

    Please post if you have any further questions.

    Cheers
    PC

  • Alok Sharma

    I think I have not put the codes in the correct place. We display only one post per page. Here is the complete code of index.php template:

    <?php get_header(); ?>
    <?php
    $yesterday = date("Y/m/d", get_the_time('U') - 86400);
    $tomorrow = date("Y/m/d", get_the_time('U') + 86400);
    $my_language = get_bloginfo('description');
    if ( $my_language == "english" ) {
    	$homepage="www";
    } else {
    	$homepage=$my_language;
    }
    ?>
    
    <?php if (have_posts()) : ?>
    	<?php while (have_posts()) : the_post(); ?>
    		<div align="center" style="background-color:white;">
    			<?php previous_post_link('%link', 'PREVIOUS PAGE'); if(get_previous_post()) echo ' | '; ?>
    			<form action="<?php bloginfo('url'); ?>/" method="get" style="display:inline;">
    				<?php
    				$select = wp_dropdown_categories('show_option_none=Select Episode&show_count=1&orderby=name&order=DESC&echo=0');
    				$select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select);
    				echo $select;
    				?>
    				<noscript><input type="submit" value="View" /></noscript>
    			</form>
    			 |
    			<?php
    				$postid = url_to_postid( get_permalink() );
    				$cat_id = get_the_category();
    				$cat_id = get_cat_ID($cat_id[0]->cat_name);
    				$args=array(
    					'cat' => $cat_id,
    					'post_type' => 'post',
    					'post_status' => 'publish',
    					'posts_per_page' => -1,
    					'orderby' => 'date',
    					'order' => 'ASC'
    				);
    				$my_query = null;
    				$my_query = new WP_Query($args);
    				if( $my_query->have_posts() ) {
    			?>
    				<form name="jump" style="display:inline;">
    					<select name="menu" onchange="window.open(this.options[this.selectedIndex].value,'_top')">
    						<?php
    							while ($my_query->have_posts()) : $my_query->the_post();
    							$mpostid = url_to_postid( get_permalink() );
    						 ?>
    							<option value="<?php the_permalink() ?>"<?php if($postid == $mpostid) echo " selected"; ?>><?php the_title(); ?></option>
    						<?php
    							endwhile;
    						} ?>
    					</select>
    				</form>
    			<?php
    				wp_reset_query();
    			?>
    			<?php if(get_next_post()) echo ' | '; next_post_link('%link', 'NEXT PAGE'); ?>
    			<?php the_content('Read the rest of this entry &raquo;'); ?>
    			<?php previous_post_link('%link', 'PREVIOUS PAGE'); if(get_previous_post()) echo ' | '; ?>
    			<strong><?php the_title(); ?></strong>
    			<?php if(get_next_post()) echo ' | '; next_post_link('%link', 'NEXT PAGE'); ?>
    		</div>
    	<?php endwhile; ?>
    <?php else : ?>
    	<div align="center" style="background-color:white;">
    		<h2 class="center">Not Found</h2>
    		<p class="center">Sorry, but you are looking for something that isn't here.</p>
    	</div>
    <?php endif; ?>
    <?php get_footer(); ?>
  • PC

    Hey Alok,

    I found a really nice plugin for you. This Plugin can be used to Independently control the number of posts listed on the front page, author/category/tag archives, search results, etc.

    Find the Custom Post Limits Plugin here

    Its compatible upto, Compatible up to: 3.3.2 though last update on Last Updated: 2010-1-5.

    However I tested this on my test multisite install, and it seemed to work fine for me. You may want to give that a try. Just remember to take a backup of your install before you try that... :slight_smile: (You know why I always suggest that)

    That way you will not have to mess up with the codes :smiley:

    And to reverse the order of posts, you can use just the below code on the archive page (In my case I have used category.php and after that configure your plugin as per the screenshot and you are good to go.

    <?php /* Reverse the sort order ascending */ ?>
    <?php query_posts($query_string . &quot;&order=ASC&quot;); ?>

    Add the above code before this one
    <?php if ( ! have_posts() ) : ?>
    And It would reverse the order of post display on category archives.

    PS : I tried to use your code to configure index.php to get that working but that did not work, may be I couldn't replicate your whole setup, so I would suggest, if you have just started with this customization, try and use the above procedure and I would be much easier.

    Also, if you want to get some serious dev stuff on this customization WPMU Jobs is always there :slight_smile:

    Screenshot 2 shows my site after I followed the above steps :wink:

    Hope it helps !

    Cheers
    PC

  • PC

    Hello Alok,

    Thanks for the nice words :slight_smile:

    page starts showing the same post, drop downs, prev / next navigations etc twice

    This is strange, where have you added that part ? and I doubt it might be due to the below code that its appearing twice.

    .
    .
    .$my_query = new WP_Query($args).
    .
    .

    I would like to try and replicate it on my test install, so, if you could send me the modified files, and setup info to goobindia (at) gmail (dot) com, I would use them on my test install and try to replicate it.

    Please do not send the admin credentials, just the theme files and any modified template files. (A .zip would be the best)

    Cheers
    PC

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.