Guide: Add Smooth Scroll to Squarespace Website

When you add anchor links to your Squarespace website you might have noticed that the page tends to “snap” straight down, creating a jarring experience for users.

To prevent this, you need to add smooth scroll to your Squarespace website.

Watch the video

Check out the YouTube video below 👇

To add smooth scroll head to Website > Website Tools > Custom CSS and paste in the following code to your custom CSS box:

html {

  scroll-behavior: smooth;

}

This will automatically make all of the anchor links on your website “smooth”, meaning you don’t need to worry about adding smooth scroll every time you add an anchor link in the future, it’s already done for you!


📩 Join the inner circle to get exclusive code updates


This is such a simple trick but one that I use on every single Squarespace website that I build as it completely transforms the user experience.


Your designer

I'm Sam, an award-winning Squarespace web designer. I have worked with every type of business, building platforms for solo entrepreneurs through to multi-million dollar corporations. If you want to discuss a potential project, you can email on sam@bycrawford.com or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.


Want more?

Sam Crawford

This article was written by Sam Crawford, one of the world’s leading Squarespace website designers.

Sam is an official Squarespace Expert, official Squarespace Partner, official Squarespace Community Leader, official Squarespace blog contributor, official Squarespace panelist, Squarespace educator and multi-award winning Squarespace designer.

https://bycrawford.com
Previous
Previous

How To Change the Hamburger Menu Icon Colour [Two Options]

Next
Next

How To Enable Tablet View on Squarespace