[Resolved] Possibility to set a Button in “mobile” Sticky header?d

[Jenny]

Hello together,

is there a possibility to set a button in the mobile sticky header?

Thanks a lot for your help ❤️
Jenny

[Fernando]

Hi Jenny,

To clarify, are you referring to adding a button solely in the Sticky nav?

[Jenny]

Yes :). between the Logo and the Burgermenü.

[Fernando]

I see. You can try through a Block Element.

Hook it to inside_navigation.

Then for your button, add this class: hide-not-sticky

Lastly, add this CSS:

nav:not(.is_stuck) .hide-not-sticky {
     display: none;
}

[Jenny]

No, I am sorry, but that doesn’t work –
I want to have it here :).

https://ibb.co/BZYKPXH

[Fernando]

I see. May I know where it went when you tried it?

[Jenny]

Can you say it in easy words please? My englisch is not very good :).
So the button it’s still online in the Backend, but not in my frontend.
Or what do you mean?

https://ibb.co/bd0xSgW

Thanks for looking it up again.

[David]

Hi there,

1. remove the CSS that Fernando provided.
2. Keep the hide-not-sticky class on the button.
3. Change the block element hook to: menu_bar_items
4. Add this CSS:

nav:not(#mobile-header) .hide-not-sticky,
#mobile-header:not(.is_stuck) .hide-not-sticky {
    display: none;
}

It may require some extra CSS to position, let me know.

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

[Jenny]

David 🙂 thank you, for looking it up.

but I can’t see the Button mobile – where is my mistake?
Can you have a look again?

That would be great 🙂

[David]

Can you select that Button and in Advanced settings, make sure its NOT Hidden on Mobile.

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

[Jenny]

hm :/ it isn’t hidden.
I have made you an Screenshot

https://ibb.co/Sycfd51

[David]

Is the button using a Global Style ? Or was it copied from another button ?

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

[Jenny]

Thank you David ❤️. I took a new Testbutton & it worked :).

[David]

Awesome – glad to hear that!

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

[Author]

Posts