Cyber Week Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Move secondary navigation to other locations

Home Forums Support Move secondary navigation to other locations

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • #139957
    Paul

    Hi Tom,

    I’d like to move my secondary navigation to other parts of a page other than just above or below the site header. In this case, I’d like to embed the secondary navigation bar into a page section on my home page only, perhaps with use of a shortcode. What would be the best practice for accomplishing this?

    #139982
    Tom
    Lead Developer
    Lead Developer

    Hi Paul,

    You could try creating a shortcode (not 100% sure it will work).

    function generate_secondary_navigation_shortcode() {
          return generate_secondary_navigation_position();
    }
    add_shortcode( 'generate_secondary_navigation', 'generate_secondary_navigation_shortcode' );

    Adding PHP: https://generatepress.com/knowledgebase/adding-php-functions/

    Then you might be able to use the [generate_navigation] shortcode in your Sections.

    #139998
    Paul

    Worked like a charm, Tom.

    For anyone wanting to do this also, I just:
    1) pasted Tom’s code into my GP child theme’s functions.php file
    2) added [generate_secondary_navigation] to a section on the page (in my case section 2)
    3) double-checked that Secondary Navigation was not checked in the Disable Elements box
    4) clicked Update

    That made the secondary nav appear twice on the page: one above the header, and one in the section where I really wanted it.

    To hide the unwanted secondary nav appearing in the header, I used the following CSS in my GP child theme style.css file:

    .main-nav {
    	display: none;
    }
    #generate-section-2 .main-nav {
    	display: block !important; 
    }

    Be sure the change #generate-section-2 in the code above to reflect the number of the section you’re actually using the shortcode in.

    #140003
    Tom
    Lead Developer
    Lead Developer

    Awesome, glad that worked for you 🙂

    #140008
    Paul

    Oops, one error.

    .main-nav in the above CSS needs to be replaced with #menu-second-menu so the links in the primary navigation don’t disappear!

    #140130
    Tom
    Lead Developer
    Lead Developer

    I would use this instead:

    .secondary-navigation {
    	display: none;
    }
    #generate-section-2 .secondary-navigation {
    	display: block !important; 
    }
    #140250
    Paul

    Cool beans. I made the changes and they’re working fine. Thanks for the suggestion!

    #140280
    Tom
    Lead Developer
    Lead Developer
    #141250
    Paul

    Well, I thought it worked. When viewing the secondary nav on mobile devices, the drop-down menu doesn’t work. The mobile icon and menu name appears, but not the drop-down which is supposed to show the sub-pages. Do I need to add additional code to what you suggested to functions.php?

    #141260
    Tom
    Lead Developer
    Lead Developer

    Can you link me to the page possibly?

    #141280
    Paul

    It’s on localhost only right now.

    #141337
    Tom
    Lead Developer
    Lead Developer

    Ok – I’ll try and find some time in the morning to put it into a shortcode and do some testing.

    I’ll get back to you 🙂

    #141506
    Paul

    Just had a thought: could it have to do with z-index? Perhaps the drop-down IS happening, but is being obscured by the following section. Or maybe it is not increasing the height of the section that it’s contained in so as to be viewable? Not sure how to tell if either is occurring though. Hmmm.

    #141721
    Tom
    Lead Developer
    Lead Developer

    It had to do with overflow.

    Try this CSS:

    .site-main .inside-navigation {
        margin: 0;
        overflow: visible;
    }
    #142048
    Paul

    Gave it a try, but no go. FWIW, I am using Menu Plus. Not sure if that makes any difference though. The secondary nav does work in it’s typical positions above and below the site header, just not as a short code in a page section, which is where I need it.

    I’m wondering if anything is missing from the shortcode that I pasted into functions.php?

Viewing 15 posts - 1 through 15 (of 21 total)
  • You must be logged in to reply to this topic.