Search Form With Keyword And Custum Texonomy In WordPress

To create a shortcode for a search form with a keyword and custom taxonomy filter using `pre_get_posts` in WordPress, follow the steps below:

**Step 1: Create the Custom Search Form**
Start by creating a custom function that generates the search form HTML with the keyword and custom taxonomy fields.

function custom_search_form_shortcode() {
    ob_start();
    ?>
    <form role="search" method="get" class="search-form" action="<?php echo esc_url(home_url('/')); ?>">
        <div class="search-form-row">
            <label for="search-keyword">Keyword:</label>
            <input type="text" id="search-keyword" name="s" placeholder="Enter keyword..." value="<?php echo get_search_query(); ?>" />
        </div>
        <div class="search-form-row">
            <label for="search-taxonomy">Custom Taxonomy:</label>
            <?php
            $taxonomy = 'your_custom_taxonomy'; // Replace 'your_custom_taxonomy' with the actual taxonomy name
            $terms = get_terms($taxonomy, array('hide_empty' => false));
            ?>
            <select name="custom_taxonomy" id="search-taxonomy">
                <option value="">All <?php echo $taxonomy; ?></option>
                <?php foreach ($terms as $term) : ?>
                    <option value="<?php echo esc_attr($term->slug); ?>" <?php selected($term->slug, get_query_var('custom_taxonomy')); ?>>
                        <?php echo esc_html($term->name); ?>
                    </option>
                <?php endforeach; ?>
            </select>
        </div>
        <div class="search-form-row">
            <button type="submit" class="search-submit">Search</button>
        </div>
    </form>
    <?php
    return ob_get_clean();
}
add_shortcode('custom_search_form', 'custom_search_form_shortcode');

**Step 2: Modify the Query Using pre_get_posts**
Next, you need to modify the main query using the `pre_get_posts` action hook based on the search input and custom taxonomy filter.

function custom_search_pre_get_posts($query) {
    if (is_admin() || !$query->is_main_query()) {
        return;
    }

    if ($query->is_search()) {
        // Keyword search
        if (!empty($_GET['s'])) {
            $query->set('s', sanitize_text_field($_GET['s']));
        }

        // Custom taxonomy filter
        $taxonomy = 'your_custom_taxonomy'; // Replace 'your_custom_taxonomy' with the actual taxonomy name
        if (!empty($_GET['custom_taxonomy'])) {
            $query->set('tax_query', array(
                array(
                    'taxonomy' => $taxonomy,
                    'field' => 'slug',
                    'terms' => sanitize_text_field($_GET['custom_taxonomy']),
                ),
            ));
        }
    }
}
add_action('pre_get_posts', 'custom_search_pre_get_posts');

**Step 3: Add CSS Styles (Optional)**
You can add custom CSS styles to make the search form visually appealing. Add the following styles to your theme’s style.css file or your custom CSS file.

.search-form {
    display: flex;
    flex-wrap: wrap;
}

.search-form-row {
    margin-bottom: 10px;
}

.search-form label {
    display: block;
    font-weight: bold;
}

.search-form input[type="text"],
.search-form select {
    padding: 5px;
    width: 200px;
}

.search-form .search-submit {
    padding: 5px 15px;
    background-color: #0073aa;
    color: #fff;
    border: none;
    cursor: pointer;
}

.search-form .search-submit:hover {
    background-color: #005a88;
}

**Step 4: Use the Shortcode**
Now, you can use the `[custom_search_form]` shortcode in your WordPress posts, pages, or widgets to display the search form with the custom taxonomy filter.

[custom_search_form]

The shortcode will render a search form with a keyword input field and a custom taxonomy dropdown. Users can enter search terms and select a custom taxonomy term to filter the search results on your WordPress site.

Remember to customize the shortcode, custom taxonomy, and CSS styles according to your theme’s design and requirements. Additionally, replace `’your_custom_taxonomy’` with the actual name of your custom taxonomy.