Navigation at bottom of browser?

What password do i need to view the front end ? I can login to the backend but still hit a password wall on the front :)

See below! thx!

Try adding this CSS:

#site-navigation:not(.stick-top):not(.toggled) ul#menu-primary-navigation > li:hover > ul {
    top: unset;
    bottom: 40px;
}

#site-navigation:not(.stick-top):not(.toggled) ul#menu-primary-navigation > li:hover > ul ul {
    top: unset;
    bottom: 0;
}

Seems to be working! Thanks so much (to all of you!) The only change I had to make was adjusting the 40 to 50 so it didn't overlap. I really appreciate your dedication to helping :)

You're welcome - glad we could be of help!

Hi

For having menu at top on computers and bottom on mobiles, I have written this:
https://webservices-pme.com/snippet/bottom-menu-on-mobile/

For having drop-up menu, you can have a look here, it is only css:
https://medium.com/@drewovercash/drop-up-menus-from-your-footer-4f6b04065a3d

Maybe I could become your sub-contractor :-)

Kind regards
Thierry

Hi Thierry,

thanks for sharing your code, this one was slightly more tricky as the Navigation is only at the bottom of the screen when the browser scroll position is at the very top. Once the user scrolls down the Navigation returns to its usual place at the top of the screen.... hence the need for some Javascript :)

Hi David

Yes, I know that JS was needed...

But, in my opinion, this is a quite strange (weird?) design. Menu will suddenly jump from bottom to top as soon as you move the mouse or the finger on a mobile. This makes the bottom menu nearly unusable.

I use JS for scrolling to make the menu appears, for example for a photographer website where the home page is a full screen photo without anything else, and the menu appears as soon as you move something: https://photostudiotnk.com/
Same for my own website :-)

Kind regards

Hi Thierry,
Thanks for your comment.

Unfortunately, what you or I think is weird sometimes doesn’t matter, it’s what the client wants that matters and mine wanted it this way. It was like this on her old site on specific pages and she really liked the look and “movement”. It works for what she’s going for in context of her website and she was very adamant about keeping it. Gotta do the job!

I’ve used your way (or similar) on other sites, but this one was a bit more tricky which is why I turned to the team for help, and they’ve been great in helping me accomplish what I was asked to do.

I appreciate you trying to offer a good solution too. Thanks!

Hi

You asked for drop-up menu, the solution was in my first post, I did not see in previous posts.

For the rest, there are websites for visitors, and there are websites for their owners :-)

Kind regards
Thierry

Thierry, for reference - the CSS for making the sub-menus to drop up is here:

https://generatepress.com/forums/topic/navigation-at-bottom-of-browser/page/2/#post-1581681

Very sorry David :-(
I did not see there was a second page on this topic, and I answered to the last question of the first page.
Regards

Have a good one, I am sure it will be useful in the future for myself and probably others :)

Hi again,

David had helped me with this before so I am hoping maybe he can help me again.

Unfortunately, after ALL of this work my client decided she didn't want the navigation switching anymore (go figure!). I managed to remove that functionality (I believe - but saved it in case she changes her mind again) but for some reason on the posts pages I am seeing double navigation (there is the one that overlays but then behind it there is another). I tried disabling the primary, secondary navs in both customize and elements so I am not sure if something is pulling from what we did.

Additionally, for some reason in mobile the posts pages for single posts are showing a LOT of space between the top and the title. It's fine on the desktop version but not there for some reason.

Any help would be appreciated! New credentials (since we launched) below. Figured it would be easier to ask in case it's related to what we did vs. spending forever trying to figure it out!

Thanks in advance,
Steph

Hi,

...the posts pages I am seeing double navigation (there is the one that overlays but then behind it there is another). I tried disabling the primary, secondary navs in both customize and elements so I am not sure if something is pulling from what we did.

The duplicate navigation you're seeing (the one on the back) is from the secondary nav. I've checked the previous codes suggested within this topic's reply and none seem to provide PHP snippet for manually adding the secondary nav so it must be a UI setting.

Try deactivating the Secondary Nav module on Appearance > GeneratePress as shown here: https://share.getcloudapp.com/jkue6LgX

Additionally, for some reason in mobile the posts pages for single posts are showing a LOT of space between the top and the title. It’s fine on the desktop version but not there for some reason.

It seems that you've added 300 padding top to the Content Padding setting for mobile found on Appearance > Customize > Layout > Container as shown here: https://share.getcloudapp.com/z8uPd6pe