If you want to create a advance search with post title, post content , post category and location. follow below steps.
1) Put this code anywhere in your theme’s functions.php
// Add Location Taxonomy for post
function ab_custom_location_taxonomy() {
$labels = array(
'name' => _x( 'location', 'taxonomy general name' ),
'singular_name' => _x( 'location', 'taxonomy singular name' ),
'search_items' => __( 'Search location' ),
'all_items' => __( 'All location' ),
'parent_item' => __( 'Parent location' ),
'parent_item_colon' => __( 'Parent location:' ),
'edit_item' => __( 'Edit location' ),
'update_item' => __( 'Update location' ),
'add_new_item' => __( 'Add New location' ),
'new_item_name' => __( 'New location' ),
'menu_name' => __( 'Location' ),
);
// Now register the taxonomy
register_taxonomy('location', array('post'), array(
'hierarchical' => true,
'labels' => $labels,
'show_ui' => true,
'show_in_rest' => false,
'show_admin_column' => true,
'query_var' => true,
'rewrite' => array( 'slug' => 'location' ),
));
}
add_action( 'init', 'ab_custom_location_taxonomy', 1 );
// Allow custom GET parameters
add_filter('query_vars', function($vars) {
$vars[] = 'post-search';
$vars[] = 'post-category';
$vars[] = 'post-location';
return $vars;
});
3) Let’s create a php file for serch form and serch result. Example : advanced-search.php
NOTE: I’m using bootstrap library to setup html structure. you can use your own html code.
<?php get_header(); ?>
<section class="search-sec">
<div class="container">
<?php
// Store variables
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$search_string = get_query_var('post-search');
$category = get_query_var('post-category');
$location = get_query_var('post-location');
// Search form
global $post;
?>
<form method="GET" action="<?php echo get_permalink($post->ID); ?>">
<div class="row">
<div class="col-lg-12">
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-12 p-0">
<input type="text" class="form-control search-slt" id="post-search" name="post-search" value="<?php echo $search_string; ?>" />
</div>
<div class="col-lg-3 col-md-3 col-sm-12 p-0">
<?php
wp_dropdown_categories([
'taxonomy' => 'category',
'name' => 'post-category',
'id' => 'post-category',
'class' => 'form-control search-slt',
'value_field' => 'slug',
'selected' => $category,
'show_option_none' => __('Any genre', 'ab'),
'option_none_value' => '',
'hierarchical' => true,
'hide_if_empty' => false,
]);
?>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 p-0">
<?php
wp_dropdown_categories([
'taxonomy' => 'location',
'name' => 'post-location',
'id' => 'post-location',
'class' => 'form-control search-slt',
'value_field' => 'slug',
'selected' => $location,
'show_option_none' => __('Any genre', 'ab'),
'option_none_value' => '',
'hierarchical' => true,
'hide_if_empty' => false,
]);
?>
</div>
<div class="col-lg-3 col-md-3 col-sm-12 p-0">
<input type="submit" class="btn btn-danger wrn-btn" value="<?php _e('Search', 'txtdomain'); ?>" />
</div>
</div>
</div>
</div>
</form>
</div>
</section>
<section class="search-result">
<div class="container">
<?php
// Reset wp_query temporary
$tmp_wpquery = $wp_query;
$wp_query = null;
// Start setting up custom CPT query
$args = [
'post_type' => 'post',
'posts_per_page' => 3,
'paged' => $paged
];
$meta_query = [];
$tax_query = [];
// Search post title and content
if (!empty($search_string)) {
$args['s'] = $search_string;
}
// Search by category
if (!empty($category)) {
$tax_query[] = [
'taxonomy' => 'category',
'field' => 'slug',
'terms' => $category
];
}
// Search by location
if (!empty($location)) {
$tax_query[] = [
'taxonomy' => 'location',
'field' => 'slug',
'terms' => $location
];
}
// Add to query arguments
if (!empty($meta_query)) {
$args['meta_query'] = $meta_query;
}
if (!empty($tax_query)) {
$args['tax_query'] = $tax_query;
}
// Perform query and assign it to wp_query
$posts = new WP_Query($args);
$wp_query = $posts;
if (have_posts()) { ?>
<div class="row">
<?php while (have_posts()) : the_post(); ?>
<div class="col-md-12">
<div class="post">
<h3><?php the_title(); ?></h3>
</div>
</div>
<?php endwhile; ?>
<div class="pagination">
<?php
the_posts_pagination([
'mid_size' => 2,
'prev_text' => __('« Previous', 'ab'),
'next_text' => __('Next »', 'ab')
]);
?>
</div>
</div>
<?php } else { ?>
<div class="row">
<p class="no-posts"><?php _e('No books found.', 'ab'); ?></p>
</div>
<?php }
// Reset wp_query back to what it was
$wp_query = null;
$wp_query = $tmp_wpquery;
?>
</div>
</section>
<?php get_footer(); ?>
3) Copy below css code and paste into your css file
/*search box css start here*/
.search-sec{
padding: 2rem;
}
.search-slt{
display: block;
width: 100%;
font-size: 0.875rem;
line-height: 1.5;
color: #55595c;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
height: calc(3rem + 2px) !important;
border-radius:0;
}
.wrn-btn{
width: 100%;
font-size: 16px;
font-weight: 400;
text-transform: capitalize;
height: calc(3rem + 2px) !important;
border-radius:0;
}
.search-result {
width: 100%;
padding: 2rem;
background: #efefef;
}
.search-result .post {
box-shadow: 0px 0px 8px 1px #cacaca;
background: #fff;
padding: 10px;
margin: 8px 0;
}
@media (min-width: 992px){
.search-sec{
position: relative;
/*top: -114px;*/
background: rgba(26, 70, 104, 0.51);
}
}
@media (max-width: 992px){
.search-sec{
background: #1A4668;
}
}
Last Update on:March 5th, 2023 at 5:19 pm