Sticky Tabs Section for Single Page

Description

• Sticky tabs section on scroll
• Click on each button on section will scroll to corresponding sections on current page

#A. Install Code

First, let’s assume we have 4 sections: About, Pricing, Contact, Services

#1. First, hover on top right of each section > Click Edit Section

At Anchor Links > Enter word like this: about

pricing

contact

services

#2. Next, add a section on top > Add 4 buttons, something like this

#3. In each button > enter url like this: #about

and make sure Open in New Tab is disabled

#pricing

#contact

#services

#4. Result: When you click on each button, it will scroll to corresponding section

To make section with buttons sticky on scroll, follow this.

Hover on top right of section > Click Edit Section

At Anchor Links > Enter word: sticky tabs

#5. Next, use this code to Custom CSS

section#sticky-tabs {
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 10px !important;
    z-index: 9999 !important;
}