This tutorial provides the steps to implement Monochrome Pro’s header search feature in Genesis Sample 2.8.0. The idea is to show a search box covering the entire site header when a magnifying search icon at the right of nav menu is clicked. As with the earlier tutorial for Showcase Pro, we shall use the WooCommerce’s […]
Header Search
Header Search in Altitude Pro
In the comments section of Header Search in Genesis, a user asked: Hi Sridhar, Thank you for all that you do! I’m trying to accomplish this in Altitude Pro, but am not sure where to implement some of the code. For example, Altitude Pro does not have a file similar to js/genesis-sample.js. I tried following […]
Header Search in Business Pro
This tutorial provides the steps to add a magnifying glass search icon at the right of Primary nav menu in Business Pro, which when clicked, will show a search box covering the entire site header based on the code from Monochrome Pro. https://sridharkatakam.com/wp-content/uploads/2018/03/Screen-Recording-2018-03-29-at-12.16-pm.mov.mp4 Screenshots: Note: Assumes that Header Right widget area is not populated. Tested […]
Header Search in Genesis
This tutorial provides the steps to add a magnifying glass search icon at the right of Primary nav menu in Genesis, which when clicked, will show a search box covering the entire site header based on the code from Monochrome Pro. Screenshots: While the tutorial has been written for Genesis Sample 2.6.0, it should work […]
WooCommerce product search in Showcase Pro’s header
This article provides step-by-step instructions on implementing the header search from Monochrome Pro in Showcase Pro and displaying WooCommerce’s default product search instead of WordPress’s – covering the site header when a magnifying search icon at the right of nav menu is clicked. Screenshots: Homepage on page load: After clicking on the search icon: After […]
Recent Comments