In this article I provide the code to display a narrow search form floated to the right in Primary and Secondary navigation menus in Genesis which when clicked becomes wider while combining ideas from my other articles on search form (1, 2 and 3) in Genesis.
Primary Navigation
Go to Genesis > Theme Settings > Navigation and set Search form to be displayed in Primary Navigation Extras.
Add this in functions.php:
That is almost what I have wanted to do in my last site. However I would love to do a combination of what you have here and the search type bar in twenty fourteen. But for the full width to be above the navigation rather than below the navigation like 2014 theme.
do you how i can put this on the header right widget area?
How would you add this to the utility bar right?
How would you use the magnifying glass from Dashicons instead of FontAwesome in this case?
For this case, I think you could use the background image as the reference link as Srid listed.
I have just added an update the end of my above post to answer this.
Can this code be used for the wordpress, i have installed artisteer them on WP, if this code can’t be used then what is recommendations for me, please give me the code for WordPress
Can this code be used for the wordpress, i have installed artisteer them on WP, if this code can’t be used then what is recommendations for me, please give me the code for WordPress, Which platform you are using for your website template, and your site building also?
I have inserted the code in the mentioned directories of WP, but not working, define complete procedure of using it on WP
I like this tutorial very much! Only, the magnifying glass does not appear on my site (I added the code for the primary navigation). Is there a way I can figure out what’s happening? Thanks in advance. 🙂
After adding the first code in functions.php wordpress is already crashing.
Doesn’t work 100%
Search box has another two magnifying glasses in it.
Can you provide the URL of your site?