How can I do this...

Hi there,

you can add your button html ( or shortcode ) for example:

<a href="#">Button</a>

inside the Mobile Header using a Hook Element and selecting the inside_mobile_header hook.

Note: this the mobile-button class will be our CSS selector.

The use this CSS to hide it on static navigation:

.mobile-header-navigation:not(.is_stuck) .mobile-button {
    display: none;
}

It will need some other CSS to position it - i would need to see the GP site setup to advise on that.

Hi,

Sorry for the late reply on this.

That's worked. Just need a bit of help positioning the button and the menu if you don't mind?

https://renovationrates.co.uk/

Thanks a lot.

Are you wanting a logo there?
If so can you add on in Customizer > Layout > Header --> Mobile Header

Hi, no the logo will take up too much room. I just need the elements aligning nicely if you can help?

Try this CSS to fix the alignement. And it will display logo when static and button when sticky

.mobile-header-navigation a.mobile-button {
    margin: 5px auto 5px 5px;
}

.mobile-header-navigation:not(.is_stuck) a.mobile-button,
.mobile-header-navigation.is_stuck .site-logo.mobile-header-logo  {
    display: none;
}

Thanks, but how can we fix the layout?

I forgot to say.
Edit the button in your Hook.

So it includes the mobile-button class eg. <a class="button mobile-button"

That, sir, has worked perfectly.

Thanks so much for you help.

Generate Press and the support you guys give is FANTASTIC!

Glad to hear that = and happy to be of help