The question:
i want to build category and keyword based search form. so i got this following form
<form role="search" method="get" id="searchform_special" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<div>
<label class="screen-reader-text" for="s"><?php _e( 'Search for:', 'woocommerce' ); ?></label>
<input type="text" value="<?php echo get_search_query(); ?>" name="s" id="s" placeholder="<?php _e( 'Search for products', 'woocommerce' ); ?>" />
<input type="submit" id="searchsubmit" value="<?php echo esc_attr__( 'Search' ); ?>" />
<input type="hidden" name="post_type" value="product" />
<input type="hidden" id="home_url" value="<?php echo esc_url( home_url( '/' ) ); ?>" />
<input type="hidden" id="categ_base_lang" value="<?php echo _x('product-category', 'slug', 'woocommerce') ?>" />
</div>
</form>
Its works only for keywords. When i update this to category search means not worked. my page screenshot is given below.
I want to make this type of header search. so please help me anyone
The Solutions:
Below are the methods you can try. The first solution is probably the best. Try others if the first one doesn’t work. Senior developers aren’t just copying/pasting – they read the methods carefully & apply them wisely to each case.
Method 1
I just made it for a client, you’ll have to do it on the pre_get_posts
action. That means you will add parameters to the WordPress query before it returns the posts.
Add this to functions.php:
// advanced search functionality
function advanced_search_query($query) {
if($query->is_search()) {
// category terms search.
if (isset($_GET['category']) && !empty($_GET['category'])) {
$query->set('tax_query', array(array(
'taxonomy' => '***the_taxonomy_slug_of_your_category***',
'field' => 'slug',
'terms' => array($_GET['category']) )
));
}
}
return $query;
}
add_action('pre_get_posts', 'advanced_search_query', 1000);
The code above works assuming you passed a category
variable. You can do it by creating a select
tag with ‘category’ as name :
<select name="category">
<option value="***cat_slug***">Cat. name</option>
<option value="***cat_slug***">Cat. name</option>
<option value="***cat_slug***">Cat. name</option>
</select>
The complete form:
<form role="search" method="get" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<!-- With this hidden input you can define a specific post type. -->
<input type="hidden" name="post_type" value="your_post_type" />
<input name="s" type="text" />
<select name="category">
<!-- Insert here all option tags you want, with category slug as value -->
</select>
<button type="submit">Submit</button>
</form>
Once submitted, $_GET[] will contain s
, post_type
and category
. s
and post_type
are used by default WP search, and category
will be using in pre_get_posts()
to add parameters to WP query.
So finally WP query will consider:
- s : your keywords.
- post_type : avoids mixing results if several post types have a same taxonomy.
- category : the taxonomy you’re searching on.
For WooCommerce
Replace the action
attribute of your <form>
tag by:
<?php echo get_permalink( wc_get_page_id( 'shop' ) ); ?>
You may also leave it empty if you’re sure your form is only on the shop page.
Set the value of the hidden field to product
, the custom post type slug for WC products.
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0