Display multiple category posts on a page in wordpress

2
votes

I want to display posts for multiple categories. I have created a MULTISELECT drop down of all categories using code below:

<form method="get" action="<?php bloginfo('home');?>" >
    <select name="cat" multiple> 
     <option value=""><?php echo esc_attr(__('Please Select Your Choice')); ?></option> 
     <?php 
      $categories=  get_categories('show_count=0&orderby=name&echo=0&hierarchical=true&depth=1&taxonomy=category&exclude=1'); 
      foreach ($categories as $category) {

        $option = "<option value=$category->term_id>";
        $option .= ucfirst($category->cat_name);
        $option .= '</option>';
        echo $option;
      }
     ?>
    </select>
<input type="submit" id="searchsubmit" value="Search" name="submit"/>   
</form>

Whenever i selects more than one category, I can see all cat ids in url like: http://abcd.com/?cat=7&cat=8&cat=9 But it displays only last category posts using archieve.php file. I want to display all selected category posts on the page.

Thanks in advance.

2
wordpressselectpostcategories
You can display categories by wp_dropdown_categories(). And to make this multi selectable use this jQuery $(".multiselect").attr( 'multiple', 'multiple' ); see it here - Amit Kumar Gupta

2 Answers

4
votes
<?php 

$categoryids = array(3,6,8,19);

$args = array(
'numberposts'     => 20,
'category__in'    => $categoryids,
'orderby'         => 'post_date',
'order'           => 'DESC',
'post_type'       => 'photo',
'post_status'     => 'publish' );

$posts_array = get_posts( $args );

?>



<!-- The carousel -->
<div class="scrolimageview">
    <div class="prvdiv"><a href="javascript: void(0)" id="gallery-prev"><img src="<?php bloginfo( 'template_url' ); ?>/images/prev.png" width="40"/></a></div>
    <div id="gallery-wrap">
        <ul style="width: 2068px; left: -188px;" id="gallery">
            <?php foreach ($posts_array as $postd): ?>
            <?php
            $customd = get_post_custom($postd->ID);
            $attached_photo_filed = $customd["attached_photo"][0];
            $attached_photod = str_replace($postd->ID . '_', $postd->ID . '_thumb_',$attached_photo_filed);
            $imaged = $upload_dir['baseurl'] . '/photos/' . $attached_photod;
            ?>
            <li><a href="<?php get_bloginfo('url')?>/photo-details?id=<?php echo $postd->ID; ?>"><img src="<?php echo $imaged; ?>" alt=""></a></li>
            <?php endforeach; ?>
        </ul>
    </div>
    <div class="prvdiv1" style="float:right"><a href="javascript: void(0)" id="gallery-next"><img src="<?php bloginfo( 'template_url' ); ?>/images/next.png"/></a></div>
</div>

This code is from one of my project running live. So it's 100% working, please let me know if you fall into any trouble with it.

2
votes
<?php 
if(isset($_POST['submit']))
{
    $categories = $_POST['category'];

    print_r($categories);   
}
?>
<form action="" method="post">
    <select name="category[]" size="5" multiple="multiple">
        <option value="1">Red</option>
        <option value="2">Green</option>
        <option value="3">Blue</option>
        <option value="4">Yellow</option>
        <option value="5">Orange</option>
        <option value="6">Purple</option>
        <option value="7">Megento</option>
        <option value="8">Green</option>
        <option value="9">White</option>
        <option value="10">Black</option>
    </select>
    <input type="submit" name="submit" value="Submit" />
</form>

Note use of [] in here -