Adding a Menu Search Icon

How to add a search menu icon with popup/dropdown search field.

To add a search icon with popup search box, add a Custom Link menu item and add search to the CSS Classes field.

If you don’t see the “CSS Classes” field, visit Dashboard > Appearance > Menus, click “Screen Options” at the top, and check the CSS Classes box.

The following screenshot is how your custom link should be setup in order to enable the search icon with popup search field.

The “Navigation Label” can be anything. Though it won’t be shown, it should be related to “Search” in your site language. The “CSS Class” must be exactly “search”, all lowercase and without quotes, as seen in the screenshot below.

If you don’t see the CSS Classes field, here is how to make sure it’s enabled in WordPress, via Dashboard > Appearance > Menus: