SearchWP Blog

WordPress Tutorials, Tips, and Resources to Help Grow Your Business

How to add a search bar in WordPress

Having a search bar on your WordPress website is a helpful feature that allows visitors to find the content they’re looking for in a few seconds.

Unfortunately, not every WordPress theme has a search bar by default. And it might be challenging to figure out how to add it if you’re a beginner. 

But there are simple ways of showing a search bar on your site. You can simply enable an option in your site’s theme settings, use a widget, or add it using the theme editor.   

In this article, we’ll show you how to add a search bar to your WordPress website without any code.

Why Add a Search Bar to Your Website?

A search bar not only allows your website visitors to find the content faster. It also brings plenty of hidden advantages that significantly boost your website’s performance.

Here are just a few examples of why you need a search bar on your website:

  • Boost Conversion Rate: The easier it is for people to find the product they want on your site, the higher the chances are that they’ll buy from you.
  • Increase Content Discoverability: Creating quality content takes hard work and a lot of time. The search bar allows you to maximize your efforts by helping visitors discover your content with ease.
  • Improve User Experience: If visitors had a great time exploring your website, it makes them return again and again. A loyal audience is valuable, as they want to consume as much of your content as possible.
  • Skyrocket SEO: Rest assured, all of the above won’t escape the attention of Google. By increasing engagement on your site, you encourage users to spend more time on your site. This sends a positive signal to Google and helps boost your keyword rankings. 

Now that we know the benefits of having a search bar, let’s see how to change the default WordPress search and different ways to add a search bar on your website. You can click the links below to jump ahead to any section:

Change the Default WordPress Search Settings

The native WordPress search is limited and not great for sites that have a lot of content or products. 

For instance, it doesn’t include important information like tags, categories, custom fields, product details, documentation like PDF files, and more while searching for content. This leads to poor user experience, as your visitors might not be able to find what they are looking for. 

Besides that, you cannot exclude or prioritize specific pages, as well as customize the order of search results in general. And you also don’t get any search statistics, which can be a great source for generating new content ideas and understanding your audience. 

The best way to improve the search experience in WordPress is by replacing it with SearchWP. It is the best search plugin for WordPress and helps you create custom search engines, include custom fields, taxonomies, and other essential details in the search process.  

SearchWP

Plus, you can also create custom search forms using the pre-made layouts in SearchWP. There are different options for customizations, so you can easily edit the templates to match your brand. The plugin also lets you make a search bar that searches your WordPress site.

For more details, please see our guide on how to change the default WordPress search settings

Next, let’s look at different methods for adding a search bar in WordPress. 

Method 1: Add a Search Bar as a Widget

One of the most popular way of adding the search bar is to add it as a widget. 

To do that, you only need to drag and drop the appropriate widget to the area where you want it to appear. However, you’ll need to ensure that your WordPress theme supports a widget area. 

The very first step is to open your WordPress dashboard and navigate to the Widgets tab under Appearance.

Go to widgets tab

Next, you need to decide where you’d like to show the search bar in the widget area. 

Simply click the Plus button at the top left and find the ‘Search’ widget. 

Find the search widget

Then drag it to the area you want it to appear on your website.

Here is how it should look like:

Drag and drop the search widget

Don’t forget to press the Update button at the top right. 

This will save all your changes, and your search bar will be live on your website.

press the update button

Now we need to make sure that the search bar actually starts displaying in the footer widget area where we added it.

As you can see, the search bar works perfectly on our demo site. To provide a more rich experience, we’re also using the Live Ajax Search feature in SearchWP, so users can quickly get relevant search results. 

The search bar works

Method 2: Add a Search Bar Using WordPress Theme Customizer

Another way of adding a search bar in WordPress is by enabling it in your site’s theme. 

Some WordPress themes come with a built-in search bar, but it’s not active by default. You will need to open the Theme Customizer and head to the navigation settings to enable it.

Note: The steps may vary depending on the WordPress theme you’re using. For this tutorial, we used the GeneratePress theme. 

To get started, you can head to Appearance » Customize from the WordPress dashboard. 

Go to customize tab

On the next screen, you should see the WordPress Theme Customizer. 

From here, you’ll need to go to Layout » Primary Navigation from the menu on the left. 

Go to primary navigation

Next, you will see different navigation options for your theme. 

Go ahead and click the dropdown menu under Navigation Search and select the Enable option.

Enable the navigation search

When you’re done, don’t forget to press the Publish button at the top once done.

After that, let’s go ahead and visit our website and check if everything works fine. There should be a magnifying glass icon in the top right corner. 

Magnifying glass icon

Method 3: Add a Search Bar Using Full Site Editor

If you’re using a block based WordPress theme, then you can add a search bar using the Full Site Editor (FSE). 

To start, you’ll need to head to Appearance » Themes from the WordPress dashboard and click the ‘Customize’ button. 

WordPress theme customizer

On the next screen, you will see the Full Site Editor. 

From here, head to Navigation from the menu on the left. 

Head to navigation menu

After that, you’ll need to click the 3-dots icon to open more options. 

Then you can click the ‘Edit’ button.

Edit the navigation menu

After that, you can click the ‘+’ button to add a new block.

Simply navigate to the ‘Search’ block and add it to your navigation. 

Add search widget to FSE

When you’re done, simply save your changes.

After that, you can visit your website to see the search bar in action.

View search in FSE

Bonus: Add a Modal Search Form to WordPress Menu

Is the search bar taking up a lot of space on your site, but you still want to offer a search functionality to visitors? 

The perfect solution is to add a modal search form. It transforms the search experience and declutters your site. When a user clicks on the search option or an icon on your website, a small popup box opens with the search form. 

The easiest way to add a modal search form to the WordPress navigation menu is by using the SearchWP Modal Search Form plugin. It lets you can add a lightweight modal search form next to your menu items in just a few clicks.

SearchWP modal form preview

A modal search form in the WordPress menu also provides a modern look. It provides a distraction free search experience and fits seamlessly into your site’s theme. 

To learn more, please see our guide on how to add a modal search form in WordPress

We hope this article helped you learn how to add a search bar in WordPress using different ways. You may also want to see our guide on how to customize the search widget in WordPress and how to fix WordPress search not working.

Ready to create a better and more personalized WordPress search experience? Get started with SearchWP today! 

author avatar
Aazim Akhtar

Create a Better WordPress Search Experience Today

Never lose visitors to unhelpful search results again. SearchWP makes creating your own smart WordPress search fast and easy.

Get SearchWP Now
Multiple Search Engines Icon