SharePoint Sticky Headers

So I’ve been doing a lot of work in SharePoint here recently and during my time I’ve stumbled upon many helpful tools to help make things oh-so-easy during the development phases. So when I found this set of sticky headers for SharePoint, I ended up making it a staple in my toolkit and now use it regularly.

Download Now!

SharePoint 2013 Sticky Headers 6.36 KB 655 downloads

Use this template for applying sticky headers to your SharePoint Site library or...

I can’t take credit for these sticky headers though, Daniel Stoelzner with spoodoo.com put this lovely snippet together and I have to say it works flawlessly. As you can see in the image above, it simply sets the title row in a SharePoint list or library as fixed and enables/disables when you scroll down/up. Also, from what I have tested, this works with SharePoint 2013 both in an Office 365 environment, as well as an on-premise environment.

How to Implement SharePoint Sticky Headers

The best part about these SharePoint Sticky Headers are that they are super simple to implement. You don’t have to know a lick about SharePoint development, matter fact you can do this straight through the UI without using SharePoint Designer.

Just follow the below steps and you will get these sticky headers implemented to your SharePoint site in no time!

  • Step 1 – Upload the StickyHeaders_v2.8.js file into your SiteAssets library
  • Step 2 – Go to the page you want to implement, and place it in edit mode
  • Step 3 – Insert a script editor web part
  • Step 4 – Insert the following snippet into your script editor web part:

    Important: Update ‘path to the script’ with the actual path to the script on your site…

So there you have it! Now go implement this on those enormous SharePoint Lists & Libraries we all know you have, and keep the user experience up to date with these fashionable sticky headers.

Tags: