Easy methods to Add a Search Bar to WordPress Menu (Step by Step)

5 minutes read

Do you need to add a search bar to your WordPress navigation menu?

By default, WordPress allows you to add a search part in your web site sidebar, footer, and different widget-ready areas. Nonetheless, many customers desire to have the WordPress search field within the navigation menu as a result of it’s simply noticeable on the highest.

On this article, we’ll present you how one can simply add a search bar to your WordPress menu with out having any coding data.

Why You Ought to Add a Search Bar in Menu?

A website search makes it straightforward on your customers to seek out what they’re searching for with out leaving your web site. It helps enhance person expertise in your web site and boosts engagement.

This is the reason most usability specialists advocate including a search possibility within the navigation menu, so customers can simply discover it.

Nonetheless, the default WordPress search widget is restricted to solely widget-ready areas.

Fortunately, there are lots of totally different WordPress search plugins which allow you to add the search bar to totally different places in your website together with menus.

For this tutorial, we’ve chosen the Ivory Search free plugin. It permits you to create new customized search varieties and improve the default WordPress search.

With that stated, let’s check out how one can add a search bar to your WordPress menu.

Including a Search Bar to WordPress Menu

Very first thing it’s essential do is to put in and activate the Ivory Search plugin. For extra particulars, see our step-by-step information on how one can set up a WordPress plugin.

Upon activation, it’s essential go to Ivory Search » Search Kinds web page to create a brand new search type.

Ivory Search Include Options

The plugin robotically provides the default search type, so you’ll be able to rapidly evaluation its settings and add it to your WordPress menu.

Search settings will let you choose which content material in your web site needs to be included within the website search.

The ‘Contains’ part allows you to select which put up varieties, posts, pages, class, customized fields, and many others. needs to be included within the search question. That you must evaluation the choices and click on the Save Type button.

Subsequent, there’s the ‘Excludes’ part, which helps you to outline the content material that you just don’t need to present in search outcomes. As soon as performed, click on the Save Type button once more to retailer your settings.

Ivory Search Exclude Options

The ‘AJAX’ part allows you to allow AJAX performance on your search type.

Ivory WordPress Search Bar AJAX Settings

The ‘Choices’ part allows you to outline what number of outcomes to indicate per search web page together with different superior settings.

Define Search Results Per Page in Ivory Search Plugin

Now your customized WordPress search type is prepared. As soon as once more, don’t overlook to save lots of your settings.

After that, the following step is so as to add the search type to your navigation menu. Merely go to Ivory Search » Settings web page to configure the search bar to your WordPress menu.

On this web page, you will note the ‘Choose Menu’ tab. From right here, you’ll be able to merely toggle the menu the place you wish to add the search bar.

Select WordPress Menu to Show Search Bar

This record of menus (Main Menu and Footer Menu) belongs to your WordPress template. In the event you change the template of your website, then the record will likely be robotically up to date with the out there menus out of your template.

After that, you’ll be able to select the search model from the Type Type accordion beneath.

The plugin permits you to show the search type in 5 totally different kinds: Default, dropdown, sliding, full width, and popup.

Ivory Search Form Styles

In the event you like, you’ll be able to additional customise the choices by going to the ‘Settings’ part beneath ‘Menu Search’.

From there, you’ll be able to add your search type to the header, footer, handle cellular show for search, and extra. These settings may also assist in controlling the search outcomes on your customers.

Ivory Search More Settings

As soon as you’re happy, make certain to save lots of your settings. After that, you’ll be able to head over to your web site to see the search bar within the WordPress navigation menu.

Search Bar in WordPress Menu Preview

We hope this text helped you learn to add a search bar to a WordPress menu. You may additionally need to see our record of most helpful tricks to velocity up WordPress and increase efficiency.

In the event you appreciated this text, then please subscribe to our YouTube Channel for WordPress video tutorials. You may also discover us on Twitter and Fb.

Facebook Twitter LinkedIn Whatsapp Pocket

Related Posts:

Do you need to make a dropdown menu and add it to your WordPress web site? A dropdown menu reveals an inventory of hyperlinks as you’re taking your mouse over an merchandise on the menu. We use a dropdown menu on WPBeginner, go forward and take your mouse ov...
Probably the most essential step in optimizing your WordPress web site for search engine optimization is including it to Google Search Console (previously Google Webmaster Instruments). Google Search Console presents particular webmaster instruments to assist...
Do you need to create a Dropbox add kind in WordPress? A contact kind with a file add choice may very well be onerous to handle if you’re getting too many attachments. You possibly can join your kind to Dropbox and add these recordsdata on to the cloud. On th...
Shortcodes are a straightforward approach so as to add dynamic content material into your WordPress posts, pages, and sidebars. Many WordPress plugins and themes use shortcodes so as to add specialised content material like contact varieties, picture gallerie...
Ever puzzled how common websites add trademark ™, copyright ©, registered ®, or foreign money characters into their articles? Lately one among our customers requested us if there was a straightforward approach so as to add particular characters into WordPress...
Do you wish to see the key phrases individuals use to search out your WordPress web site? Key phrases are the phrases customers sort in search engines like google to search out the content material they’re searching for. You’d need your web site to rank for t...