Sticky menu won't appear when menu bar is set below page header

[NBC]

Developing a site under localhost.

GeneratePress 1.3.48
GP Premium 1.3.1
WordPress 4.8

I have added a navigation logo to my primary menu bar, which is set to full width.

The logo is set for sticky-only placement.

Sticky navigation is active for both desktop and mobile, with the transition set to slide.

The sticky menu (with the logo) appears when I locate the menu bar above the header. It does not appear when I locate the menu bar below the header. (As you can guess, I would like to place it below the header.)

The header incorporates a logo with both the site title and the tagline hidden.

Why won’t the sticky menu appear when the menu bar is set below the header?

TIA for any insights!

GeneratePress 1.3.48

GP Premium 1.3.1

[Leo]

Hi there,

Hmm duplicated the setting as what you specified above but sticky navigation is working fine: http://www.screencast.com/t/UjHeH3oi

Did I miss anything?

Hard to tell why yours isn’t working without seeing the site live…

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[NBC]

Sorry, but I can’t play Flash video.

Here are my settings, or at least the ones that I believe to be relevant.

Layout, Header
Header Width: Full
Inner Header Width: Contained
Header Alignment: Left
Header Padding: (Default values)
Mobile Header: Disable

Layout, Primary Navigation
Mobile Menu Label: Menu
Navigation Width: Full
Inner Navigation Width: Contained
Navigation Location: Below Header
Navigation Alignment: Left
Navigation Dropdown: Hover
Navigation Search: Disable
Navigation Logo: (active)
Navigation Logo Placement: Sticky
All other values at defaults

Layout, Sticky Navigation
Sticky Navigation: Both
Sticky Navigation Transition: Slide
Hide when scrolling down: (unchecked)
Menu Item Height: (default null value)

Layout, Page Header
Page Header Location: Above Content Area
Single Post Header Location: Inside Content Area

[Leo]

Just duplicated the exact settings but it’s still working for me…

Any chance you can duplicate the issue on a live test server?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[NBC]

I’d have to export and reimport the site, which no one’s supposed to see at this point in its development.

I could export my settings within GP and e-mail you the files. Will that do?

[Leo]

Using the developer tool and check the console tab, are there any errors?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[NBC]

On a hunch, I added a handful of additional paragraphs of text to the end of the good old Sample Page, which I’m using as I prototype the basics for this site.

Turns out that when the menu’s above the header, the size of the logo increases the page depth below the menu enough to force the sticky menu to appear.

When the header’s at the top, the sticky menu thinks the page is too short for it to appear, despite the fact that it’s disappeared off the screen as I scroll.

I wish I could control the depth at which it appears.

TL;DR version: page too short; menu won’t appear even though it’s scrolled off screen; can’t control depth at which effect is triggered.

[Leo]

Controlling when slide-navigation triggers is in the future plan 🙂

Glad you found the problem!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[NBC]

File this one under the “Duh” column!

If you deactivate footer widgets, the infamous Sample Page can become too short to trigger sticky menus, as was the case in my instance. It might be worth asking people about this set of circumstances if you get this type of inquiry again, as this conditioning environment is all too easy to fall into.

GP is truly amazing! I’m amazed at how Tom has expanded it just since I’ve had it. And your support is awesome!

[Leo]

Ahh I see. Thanks for reporting back!

Glad we have been helpful 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts