Search Box

Max Mega Menu Pro includes functionality that lets you replace an existing menu item with something else: either a logo, a search box, a shortcode or HTML. We’ll use this functionality to create an inline, expanding search box for our menu.

To create a Search Box for your menu, first add a ‘Custom Link’ item to your menu:

add-custom-link

Position the menu item where you’d like the search box to appear and click “Save Menu”. Once the menu structure is saved, hover over the Search item and open the Mega Menu settings for the item:

open-custom-link-settings

Next, click the Replacements tab and select “Search Box” as the replacement type. This will replace your ‘Search’ Custom Link with a working Search Box.

Use the built in settings to adjust the search box styling to match your menu theme.

There are 3 behaviour options for the search box:

  • Expand to left
  • Expand to right
  • Static

Once you are happy with the settings, click the ‘Save’ button to apply your changes.

End Result

inline-menu-search-box

Like what you see? This functionality is available in Max Mega Menu Pro

Related Articles