[Resolved] Logos in Menu instead of header – shrink when sticky

[Matthias]

hi there,

this question has been asked before – but in the answers i saw i could not find a solution for me.
What i want to do is copy the behaviour you can see here (click link).

I want a normal logo next to the menu – and have it shrinked when you scroll down – with a sticky menu.
So far i didnt get a “smooth” transition working – only a viewable replacement.

I saw that generatepress can do this (navigation as a header) – but i still want to keep a small header above the menu for social links.

Also as i just spent some time adding logo and retina logo to site identity – what about the retina logo when i just add the logo to the Sticky Navigation?

[Leo]

Hi there,

Navigation as a header with different menu item height is needed to achieve that type of transition:
https://docs.generatepress.com/article/navigation-as-a-header/#sticky-navigation-with-height-transition

What if we use the top bar widget area for your social icons?
https://docs.generatepress.com/article/top-bar-widget-area/

[Matthias]

That worked with a little playing around.
Just in case someone wanting the same + like me wanting opacity of the sticky menu – heres the solution:
https://generatepress.com/forums/topic/sticky-header-shrink-and-transparent/

Thx – solved

[Leo]

Glad you’ve figured out 🙂

[Author]

Posts