Menu Logo Menu In Genesis Sample Themes Header

This solution adds left and right menus inline with your custom logo like this :

Menu Logo Menu Genesis Sample Theme

Tested using version 2.10 of the Genesis Sample child theme by StudioPress which only works with Genesis 3.0.

Note : If you’re using a new version of Genesis Sample like 3.4, 3.4.1 or newer, use this tutorial instead.

In the above example we overhang the logo however you can modify that simply by adjusting the values for margins in the following CSS rule :


.navigation-container {
    margin-bottom: 58px;
    margin-top: -120px;  
}

And this is the result :

nav custom logo nav genesis sample

Works with or without the sticky header.

Demo Video #

Shows 2 custom menus added to the left and right of the logo in the Genesis Sample child theme by StudioPress.

Also shows both menus combined into 1 responsive drop down menu on smaller screens.

Installation – Support Included #

There’s 7 steps :

Step 1 – Find this code between lines 175 – 176 in functions.php


remove_action( 'genesis_after_header', 'genesis_do_nav' );
add_action( 'genesis_header', 'genesis_do_nav', 12 );

And modify it like this :


remove_action( 'genesis_after_header', 'genesis_do_nav' );

This removes the primary nav menu from the header.

Step 2 – Copy the PHP code from functions.php to the end of the Genesis Sample themes functions file.

Step 3 – Copy the following CSS to the end of the Genesis Sample themes style.css file and clear caching.

Related Tutorials


Comments

13 responses to “Menu Logo Menu In Genesis Sample Themes Header”

  1. Julie Clarkson Avatar
    Julie Clarkson

    Hi Brad,
    Can’t figure out why the menus aren’t showing on the right and left of the centered logo when viewing in browser. The admin console menu has the right and left menus checked. I have confirmed all code is connected properly in my modularized version of Genesis Sample. I am working locally on Local, what is the easiest way to share my code to get help? Thanks.

    1. It appears that there is no header left and header right to hook into in the layout. It is just empty space on either side of the logo. But I can hook header right and header left menus into other areas of the template. I think that is why it is not showing. How do I create the sections to hook into?

    2. The theme only shows the menu if it is classified as ‘primary’ or ‘footer’. The admin console shows header left and header right, but nothing turns up on the browser when those options are selected for the menu.

    3. genesis_do_nav() only calls the ‘primary’ navigation. That is why I can’t see the left nav and right nav. What am I missing from this tutorial? Why isn’t this working for me? Thanks.

  2. Joseph Cuccio Avatar
    Joseph Cuccio

    Hey Brad,

    I have:

    GenesisVersion: 3.3.2 & Genesis SampleVersion: 2.2.4

    **configfolder**
    breadcrumbs.php
    contributors.php
    customizer-seo-settings.php
    customizer-theme-settings.php
    layouts.php
    requirements.php
    update-check.php
    update-versions.php

    -No menus.php or responsive-menus.php

    Working on my computer, with DeskTop Server, so I can’t really send you a link. Sorry.

    Suggestions? Thanks in advance,

    -Joe

    1. Hey Joe, I’ve emailed you the solution coded into a fresh version of Genesis Sample 2.2.4 however, you might consider updating your child theme.

      I’ll publish a new tutorial because you’re a paying member however, i’ve sent the instructions about where the code is added/modified in the meantime.

    1. The theme developers removed the sub menu using by adding code in the theme.

  3. Fil Kan Avatar

    Hi

    Ok the problem was the version of genesis sample.
    I found genesis-sample-2.10 and menus.php but now no responsive-menus.php in the config folder…

    Fil Kan

  4. Fil Kan Avatar

    Hi

    In my template folder of
    I have not found the file config > menus.php
    in Step 4 – Modify the PHP code in the config > menus.php file
    All the other steps hare ok

    genesis 3.0.3
    genesis-sample.3.0.1

    Did I miss something ?
    Fil Kan

    1. It’s in the config folder of 3.0.1, just checked. If using 2.10, use this solution for step 4 https://wpsites.net/web-design/menu-logo-menu-in-genesis-sample-themes-header/#responsive-menus

Leave a Reply

Join 5000+ Followers

Get The Latest Free & Premium Tutorials Delivered The Second They’re Published.