realign header

Hi there,

Can you try setting the header alignment to center first?
https://docs.generatepress.com/article/header-layout/#header-alignment

Then I'll provide the CSS to relocate the menu toggle.

Let me know :)

Hi Leo

The header alignment is and was set to center.

Thanks

Can you disable the caching plugin first?

I don't have a specific caching plugin but maybe it's Jetpack that's causing issues. I have disabled that.

So basically you want the static header to match the sticky header?

If so try activating the navigation as header option:

Then edit this CSS:

nav#sticky-navigation .navigation-branding {
    position: absolute;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
}

to this:

.main-navigation .navigation-branding {
    position: absolute;
    z-index: 10;
    left: 50%;
    transform: translateX(-50%);
}

Thx Leo

That centers the logo. Halfway there. How do I get et the burger menu onto the left side of the page? With this, it is still on the right-hand side of the page.

Thanks again

Sorry Leo and when scrolling I need the stick menu to be fullscreen.

To move the menu icon to the left, try this CSS:

.inside-navigation.grid-container {
    justify-content: flex-start;
}

To make the sticky menu full width, go to customizer > layout > Primary Navigation, set the Navigation Width to Full.

Thanks Guys you are awsome

Thanks Craig :)
You are welcome!

Hi Guys

At the moment the logo and menu are part of the Hero.

I would like the logo and menu to sit at the top, followed by the line banner(sign up), followed by the hero. I am struggling to achieve this.

Thank you

Hi there,

looks like you're using a Header Element in Appearance > Elements to merge the Site Header and the hero.
Edit that Header Element, and on the Site Header tab uncheck the Merge with Content option.

https://docs.generatepress.com/article/transparent-header-and-navigation/

You really are my best :)

Thank you

Glad we could be of help