How to Shrink the Sticky Header on Scroll in Neve Pro

Neve Pro Addon's Header Booster module brings in a new level of customizations in Neve. Using the multiple components and the Sticky and Show only on scroll options you can easily build the header you wish for your site.

In this doc, you will learn how to shrink the sticky header on scroll. Just follow the steps below.

1. Build your header using Neve's header builder. For this example, we've used just the Logo & Site identity component.

2. Recreate your header on the second builder row. ( You can create a totally different header if you want, but for this example, we've used the second Logo & Site identity component )

3. Open the header's first row's settings by clicking on the little wheel that appears once you hover with your mouse over the row.

4. In the Style tab, update the Row height control to 200 px, or whatever value you feel is consistent with your design.

P.S Here is where you can also change the Skin Mode ( light or dark ) or choose a different background color for the row.

5. Like before, open the header's second row's settings by clicking on the little wheel that appears once you hover with your mouse over the row. 

In the Layout tab, you need to check the Stick to top and Show only on scroll options.

P.S In the Style tab is where you can also change the Skin Mode ( light or dark ) or choose a different background color for the row.

6. Save the options, scroll and enjoy your new shrinking header :)

For more details on the Neve Pro Addon, make sure you check the complete documentation.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.