Ewww… “Sticky” Tabs?

I recently stumbled upon a post in ACRL’s TechConnect blog from librarians Margaret Heller and Will Kent at Loyola University Chicago describing their migration to LibGuides 2.0. Their implementation of ‘sticky tabs‘ intrigued me. They implemented the Affix plugin for Bootstrap (the framework on which LibGuides is built) which fixes LibGuides’ tabbed navigation to the top of the page as the user scrolls through the guide content. The tabs are more visible, and the user doesn’t have to scroll back to the top to navigate to another section of the guide.

After some preliminary investigations, the Code Rascals decided that sticky tabs looked simple enough to implement. Jenifer located some helpful tutorials on the affix plugin, and we spent one of our meetings tinkering with incorporating the code into LibGuides’ customizable settings. After some trial and error (and frustration), I finally had some success a few days later!

screenshot of guide with tabs
Sticky tabs in action

I’ve noticed on many of my own guides that the homepage has the greatest number of hits, while other pages and subpages have far less traffic perhaps suggesting users are finding what they need on the homepage, or perhaps that they don’t notice the navigation to other sections of the guide. Without presuming too much about user behavior, here’s hoping that the sticky tabs increase user awareness of content beyond what’s visible on the homepage. The sticky tabs should at least ease navigation through the rest of the guide.

Try the sticky tabs out yourself here and let me know if you have any feedback. We plan to introduce a template that you can select for your guide if you’d like to start using sticky tabs!

Leave a Reply