Nav Menu

Uncombine Responsive Menu In Genesis – WordPress Website Design Article

Premium Member? – Request custom code This solution enables you to uncombine menus which display in the responsive toggle menu. By default, the Magazine Pro child theme combines the primary, header & secondary menus in the responsive menu. You can see the code for this between lines 118 – 120 in functions.php. Other themes may also include this code in a different position in the child themes functions file. To remove 1 or more menus from the responsive toggle menu,…

Read More

Install Max Mega Menu in Custom Theme Location Using PHP Function Call – WordPress Website Design Article

This tutorial provides the steps which enable you to add a mega menu to any Genesis hook position in any Genesis child theme. You can also swap out the genesis hooks and use this solution in any non Genesis child theme. Note : Assumes you have already created a mega menu. # Step 1 : In your WordPress Dashboard, go to Mega Menu > Menu Locations and click the blue button to Add another menu location. In this example, we…

Read More

Reposition Genesis Responsive Menu Icon Before Site Title On Mobiles – WordPress Website Design Article

Premium Member? – Request custom code, guaranteed The code in this download folder enables you to change the position of the responsive menu icon from the default position after the title area to before the site title area. Default Repositioned Demo Video # Shows the hamburger menu displaying after the title by default and before the title once the code from the download folder is added to the child theme. Tested using the Minimum Pro child theme by StudioPress however…

Read More

Image Behind Header & Menu – WordPress Website Design Article

Premium Member? – Request custom code The solution in this download folder enables you to : Move the primary menu inside the site header Display a image behind both the header & menu Center the header widget area between the site title and menu Here’s what the solution in this tutorial produces : The following video shows how it looks on both desktops and smaller screens. Demo Video # Shows the image covering the background of both the site header…

Read More

Image Behind Header & Menu In Genesis Sample Theme – WordPress Website Design Article

Premium Member? – Request custom code This code adds a field to the Customizer enabling you to upload a full width header image. The image displays behind the site header and primary nav menu as seen in the following screenshot : Tested using the Genesis Sample child theme by StudioPress. Demo Video # Shows the same header image displaying behind the nav menu and site header container. Installation – Support Included # There’s 5 steps : Step 1 – Copy…

Read More

Animated Search Form In Header Right Widget – Genesis Sample Theme – WordPress Website Design Article

The 2 solutions in this tutorial add back the header right widget area and also includes code to vertically align the search widget in this widget area like this. The code also adds back the after header nav menu. All header elements including title area, header right widget area and after header menu are centered on smaller screens like this : Demo Video # Shows the header right widget area containing the WordPress Search widget styled so it animates the…

Read More

Change Screen Width For Showing The Genesis Responsive Menu – WordPress Website Design Article

Need Code? – Request a Tutorial The free solution in this download enables you to change when the responsive menu icon displays in the Genesis Sample child theme. In this case, we change the width from the default 960px width : To 1200px : To change from 1200px, simply change the 1200px value in the first line of the CSS rule located inside the download folder. There’s 2 steps required. Related Tutorials Nav Menu !function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments)}; if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version=’2.0′; n.queue=[];t=b.createElement(e);t.async=!0; ……

Read More

Foodie Pro – Reposition Search Box Before Nav Menu – WordPress Website Design Article

Need Help? – Get Coding Support Now By default, the search form in Foodie Pro is added after the nav menu items like this. This solution enables you to add the search box before the nav menu like this. Code Installation # There’s only 1 step : Find the following PHP code in the Foodie Pro themes functions.php file located between lines 217 – 236 : And replace the code with this : Subscribe for new Genesis Tutorials Foodie Pro…

Read More