3 Ways To Add Search To Academy Pros Nav Menu

This tutorial contains a download folder which includes 3 different code snippets providing 3 different ways to add a search form in the primary nav menu of the Academy Pro theme by StudioPress.

Method 1 – Adds a search form to the last menu item using the default styling.

Method 2 – Adds a expanding search box using the default styling :

Method 3 – Removes the default styling and adds a animated search form with search icon like you see in the following 2 screenshots :

Expanded :

Demo Methods 2 & 3 #

Shows method 2 with the search box expanding using the default styling.

Shows method 3 with a icon added before the search form input text expanding with the border removed.

Code Installation #

Installation of code relates to usage of the files inside the download folder for registered members :

Method 1

There’s 2 steps :

Step 1 – Copy & paste the CSS from the file named style-1.css to the end of the Academy Pro themes style sheet and clear caching.

Step 2 – Copy & paste the PHP code from the functions.php file to the end of the Academy Pro themes functions file.