Add a sidebar to Squarespace | No-code sticky scroll
Want to create a clean sidebar layout in Squarespace for things like restaurant menus, personal bios, or table of contents navigation?
In this video, Loren shows you how to build a sidebar using Sticky Split in the SquareKicker Extension, then turn it into a smooth secondary navigation with anchor links. You’ll also see a simple mobile-friendly alternative using Sticky Section, so your layout still works beautifully on smaller screens.
This is a practical way to create more structured, easier-to-navigate page designs in just a few clicks.
Learn how to use Sticky Section: • How to Make Sticky Sections on Squarespace
Chapters
00:00 Intro
00:22 Setting up the page layout
00:30 Creating a sidebar with Sticky Split
01:00 Turning the sidebar into secondary navigation
01:41 Styling anchor links
02:07 Previewing the sidebar navigation
02:17 Creating a mobile alternative
02:49 Using Sticky Section on mobile
03:22 More Sticky Split and Sticky Section tutorials
In this tutorial, you’ll learn:
How to create a sidebar layout using Sticky Split
How to control sidebar position, width, and section flow
How to turn your sidebar into a secondary navigation with anchor links
How to style navigation links for a cleaner, more polished look
How to create a mobile-friendly alternative using Sticky Section
With SquareKicker, you can take all your favorite web design ideas and build them directly into your Squarespace workflow—quickly and cleanly.
👉 Start your free trial (no credit card required): https://squarekicker.com
👉 Browse all tutorials: https://squarekicker.com/tutorials
SquareKicker: no code tools to help you build custom Squarespace websites for your clients, at pace.