Authority Pro by StudioPress is a fantastic Genesis child theme to build trust as an author, blogger, freelancer, etc.

Lately, I switched to the Authority Pro theme, and I wanted to have the search icon in a header but couldn’t find a straightforward solution on the Internet. But that doesn’t mean it’s not possible. I had to take help from my developer and thought to share the code with you. The good news is Authority Pro theme comes with WordPress Dashicons integrated which makes it easy. As a best practice, take a backup of required files before modifying so you can restore when something goes wrong.

Login to your WordPress server (cPanel if you are on shared hosting) Go to WP installation and then wp-content/themes/authority-pro Add the following at end of the  functions.php file.

Next, add the following in Enqueues scripts and styles section. Ex

Save the file

Let’s add the toggle jquery functions

Go to js folder and create a new file called custom.js  with the following codes

and, finally, time to beautify the search toggle box.

Add the following in a style.css file

Save the file

That’s all. Refresh your page, and you should see the search icon and toggle in action.

I hope this helps you to add the search icon in the Genesis framework.

How to Add Search Icon in Genesis Authority Pro Header  - 91How to Add Search Icon in Genesis Authority Pro Header  - 28How to Add Search Icon in Genesis Authority Pro Header  - 20How to Add Search Icon in Genesis Authority Pro Header  - 43How to Add Search Icon in Genesis Authority Pro Header  - 66How to Add Search Icon in Genesis Authority Pro Header  - 4How to Add Search Icon in Genesis Authority Pro Header  - 96