How to Add a Site-Wide Search Bar in the Header (Not the "Listing Search" field)

encrypto · May 23, 2025, 1:31pm

Hi HivePress team,

I’ve built my website using HivePress along with its default theme and listings plugin.

Currently, there is only one search bar visible on the homepage, and it is dedicated to searching Listings only — which is expected behavior.

However, I would like to add a site-wide search bar (for pages, blog posts, general info, etc.) to the header area, like most standard websites have in their top menu or navigation bar.

I checked under Appearance > Widgets, but there is no widget area available for the site header — only for sidebar and footer sections. I also looked under the Customize panel, but couldn’t find any built-in option to add a search to the header.

My question:
How can I add a general (site-wide) search bar to the top header area — ideally in the navigation/menu bar — using HivePress? Is there a built-in way to enable the header widget area, or do I need to use a custom snippet or child theme?

Thanks in advance for your help!

ChrisB · May 23, 2025, 2:06pm

Hi @encrypto,

I’m not HivePress staff, just trying to help!

As you’ve found, the feature you describe is not currently provided out-of-the-box with HivePress. However, I had a quick search for you and found this plugin that looks like it might be able to help you achieve what you’re after:

I hope this helps!

Cheers,
Chris

encrypto · May 25, 2025, 3:53am

Thanks for the information. Sincerely and practically, I am trying to desperately limit the number of plugins on the site. Also, more importantly, Site Wide Search this should ideally be a standard feature, just because its a standard requirement.

ChrisB · May 25, 2025, 12:40pm

Hi @encrypto,

I understand. This is definitely possible, but will require custom development as the ListingHive theme doesn’t support this natively. I highly recommend using a child theme to make such changes, or else, the next time HivePress publish an update to the theme your changes will be overwritten.

I asked AI to help on your behalf. This code is untested, so use with caution, but here’s a possible solution:

Step 1: Create a Child Theme

Since you’re happy to create a child theme, this is the safest way to customize your site without losing changes during theme updates.

Set Up the Child Theme:
- Navigate to wp-content/themes/ in your WordPress directory.
- Create a new folder, e.g., listinghive-child.
- Inside this folder, create a style.css file with the following:
```
/*
 Theme Name: ListingHive Child
 Template: listinghive
 */
```
- Optionally, create a functions.php file to load the parent theme’s styles:
```
<?php
add_action('wp_enqueue_scripts', 'enqueue_parent_styles');
function enqueue_parent_styles() {
    wp_enqueue_style('parent-style', get_template_directory_uri() . '/style.css');
}
```
- Activate the child theme via Appearance > Themes in your WordPress dashboard.

For more details, see the WordPress Child Theme Documentation.

Step 2: Add the Search Bar to the Header

To place the search bar in the header or navigation area, modify the header.php file in your child theme.

Copy header.php:
- Copy header.php from the parent theme (wp-content/themes/listinghive/header.php) to your child theme (wp-content/themes/listinghive-child/header.php).

Edit header.php:

Open the copied header.php in a text editor.
Find the spot where you want the search bar (e.g., within <nav> or near the menu).
Add this code:
```
<?php get_search_form(); ?>
```

Example:
If your header.php has:

<nav class="main-navigation">
    <?php wp_nav_menu(array('theme_location' => 'primary')); ?>
</nav>

You could modify it to:

<nav class="main-navigation">
    <?php wp_nav_menu(array('theme_location' => 'primary')); ?>
    <?php get_search_form(); ?>
</nav>

This adds the default WordPress search form to the header.

Step 3: Modify the Search Query with a Filter Hook

To ensure the search bar includes blog posts, pages, general content, and HivePress listings (assuming they’re searchable), use the pre_get_posts hook. This satisfies your preference for a filter hook and adjusts the search behavior without altering the search form itself.

Add Code to functions.php:

Open or create functions.php in your child theme (wp-content/themes/listinghive-child/functions.php).

Add the following:

function include_all_post_types_in_search($query) {
    if ($query->is_search() && $query->is_main_query()) {
        $post_types = get_post_types(array('exclude_from_search' => false));
        $query->set('post_type', $post_types);
    }
}
add_action('pre_get_posts', 'include_all_post_types_in_search');

How It Works:
- is_search(): Checks if this is a search query.
- is_main_query(): Ensures it only affects the main search results (not secondary queries like widgets).
- get_post_types(array('exclude_from_search' => false)): Retrieves all post types that are searchable (e.g., posts, pages, and likely HivePress listings if configured as public).
- $query->set('post_type', $post_types): Overrides any restrictive post_type setting to include all searchable post types.

This ensures that even if the theme or HivePress limits searches to listings, the search bar will include all public content.

Step 4: Test and Style (Optional)

Test: Use the search bar to confirm it returns blog posts, pages, and listings. If listings are missing, check if HivePress sets exclude_from_search to true for hp_listing (unlikely, but adjustable via code or HivePress settings if needed).

Style the Search Bar:
Add CSS to style.css in your child theme:

.search-form {
    margin: 10px 0;
    display: inline-block;
}
.search-field {
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.search-submit {
    padding: 8px 12px;
    background: #0073aa;
    color: #fff;
    border: none;
    border-radius: 4px;
}

Adjust as needed to match your site’s design.

I hope this helps!

Cheers,
Chris

andrii · May 26, 2025, 9:43am

Hi,

Unfortunately, there’s no such feature, it would require a custom implementation. However, thank you for your feedback, we will consider adding this feature. If you need this feature urgently, I recommend hiring an expert or submitting a customization request: Customize your website | HivePress