Site logo

Archived topic

Navigation location

11 replies · Started by Michael on July 14, 2021

Viewing posts 1–12 of 12

Hello,

I hope you can help me. How do I manage to place the navigation below a header with image? The navigation should not disappear when scrolling, but stay on top. (See screenshot)

Thanks a lot!

Hi Leo,

i have created a header - Design - Elements - Page Header. Link of the page with the header is attached.

Thanks a lot!

The page header is a very outdated way to create things like these.

Would you consider using a block hook element with GenerateBlocks instead?

Then you can just choose the generate_before_header hook.

Let me know :)

What is used does not matter :-) the main thing is that it works...

Hello Leo,

great, thanks a lot for your help! I actually got it right :)

I still have one "small" question: I have inserted the code for the navigation: https://docs.generatepress.com/article/centering-logo-navigation/

Do you have a tip on how I can keep a certain distance to the left and right? The leftmost and rightmost links in the navigation should not be so far away from the page...

Hi there,

split menus that have uneven sides ( eg. 3 items to left and 2 to the right ) are tricky to constrain.
Are you considering adding any more menu items or removing the Home link ( as the logo is the common UI for that ) ?

Hello David,

soon we will have 3 links on each site, yes.

Thank you and best regards
Michael

Once there in place we can take a look and provide some CSS to evenly space them and constrain their width so they sit closer to the logo.

Let us know when its been added :)

Hello David,

that's great, thank you!Below you will find the link. The menu is currently stretched with the Customizer....

Thank you very much and best regards
Michael

First thing is to reduce the Customizer > Layout > Primary Navigation --> Menu Item Width.
Try: 20px.

Then we can use some CSS to minimize its width:

.main-navigation .main-nav>ul {
    max-width: 1100px;
}
This archived topic is closed to new replies.