How can we help you today?

How to Prevent SharePoint Header Size Change (Disable Shy Header) on Scroll on Modern SharePoint Sites

If you use a compact, standard or extended SharePoint header layout, you may have noticed that its size is changing on scroll to a minimal (shy header), like this:


Initial header size
  • Compact layout:

  • Standard layout:

  • Extended layout:

After scroll
  • Minimal layout:


In this article we will show you how to disable this behavior.


Before:


After:


It is possible to achieve this result, adding some Custom CSS to the ShortPoint Theme Builder. Please, follow the steps below.


TABLE OF CONTENTS


This article is for you if

  • You are using SharePoint Online (Office 365) or SharePoint 2019 environment.
  • You are using Modern SharePoint experience.
  • You are a ShortPoint user and ShortPoint is installed on your SharePoint site(s). 

Step 1. Prepare the Custom CSS solution


For disabling SharePoint shy header behavior you will need to use this custom CSS code:


.shortpoint-proxy-theme-site-header [class*="mainHeader"] {
position: relative !important;
animation: none !important;
}
.shortpoint-proxy-theme-site-header [class*="logoCell"] {
margin-right: 20px !important;
}
.shortpoint-proxy-theme-site-header [class*="shyHeader"] {
display: none !important;
}


Copy it and proceed to the step 2.


Step 2. Apply the Custom CSS from the ShortPoint Theme Builder


Open the ShortPoint Theme Builder (Site contents > ShortPoint Dashboard > Theme Builder) 


In the Theme Builder menu, navigate to Utilities:



Select Custom CSS: 



Paste the copied CSS code from the step 1 to the Custom CSS field, and click Apply:



Save your customizations by clicking Publish button.



Result


That's it. Now the SharePoint header size is not changed on scroll:




Related articles:

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.

World's best intranet sites are designed using ShortPoint

Get started today! Learn more
See all 10 topics

Start a trial

Ignite your vision. Install ShortPoint directly on your site, or play in sandbox mode. No credit card required.

Get started today

World’s best intranet sites are designed using ShortPoint

Thousands of companies using ShortPoint everyday to design, brand and build award winning intranet sites.

Get started Learn more