How to Add Anchor Links in Squarespace (and create that awesome scroll effect!) - Version 7.0

Heads up: I use affiliate links for my fave products. If you click and purchase, I may receive a small commission at no extra cost to you.

Anchor links let you jump to different sections on your page. You can use this to create an awesome one-page website, too!

Hit play to learn how to add anchor links in Squarespace:

video transcript:

How to Add Anchor Links in Squarespace (Version 7.0)

Welcome back to my channel. In today’s video, I want to show you how to create Anchor Links in Squarespace. But first, there might be a few of you who are wondering what this is. Basically, it’s when you create a link at the top of your website that leads down to a different section of your page automatically. It’s actually really easy to do, so that’s why I decided to create this tutorial.

If you are new here, welcome. My name is Louise of Louisehenry.com (formerly Solopreneursidekick.com). I put out new videos every single week, all about building your online business, so if that is something that you are looking to do, make sure that you hit Subscribe down below and that you hit that little Bell icon, to get notified every time I post something new.

Here is how to create Anchor Links in Squarespace.

Create an Index Page

The first thing that we need to do is create an Index page. In Squarespace, you’re going to click on Pages, and then click on the plus (+) sign and select Index. Next, you’re just going to title this page, and then you need to start building out the sections.

Add Sections

In order for this to work, you need to have a few different sections. I’m going to click on the plus (+) sign and just select Content. You could do Content or Gallery. I’m going to title this Section 1 and I’ll just put in some demo content so you can see what it looks like. So, we have Section 1.

Now I’m going to click Add Section, title this Section 2, and choose a different layout – let’s say I want to do some Details - save that. Then, again, you’re going to click Add Section, click Content, and I’m going to title this Section 3. So, now let’s say I want to do a Contact page. Now, I’m going to click Start Editing.

URL Slugs

Now that we have our three different sections created, we can get to the Anchor Links part.

I’m going to scroll up to the top, and what I’m going to do it click Edit on this first section here, and just insert a Text Box. Here I’m going to link to Section 2 and to Section 3 (because we’re already on Section 1). Just remember that this is where we’re going to link them. Now what you need to do is you need to go to the Section that you want to link to – this is the one that we’re dropping down to. We’re going to click on the little Gear icon, scroll down and make sure that you know what the URL Slug is. I know that this is section-2. Then what I need to do is check Section 3 as well, which I know will be the same. So, we know our URL Slug. Click Save.

We also need to make note of the URL Slug for the Index page itself. Click on the Gear icon next to that, scroll down, and you will see URL Slug. As you can see, it’s title, so that’s good. We’re going to click Save. With these URL Slugs you can make them whatever you want – I would just keep it short, and if you do have more than one word, separate them with a dash.

Create The Anchor Links

Now to actually create the Anchor Links, we’re going to click Edit, and where it says Section 2, I’m going to highlight this, click on this little Link symbol right here, and then I’m going to put forward slash (/), the URL Slug for the page - so that’s title - forward slash (/), and the I’m going to put the Hashtag (#) symbol and then I’m going to put the URL Slug for Section 2 and click Add Link.

Then I’m going to do that again for Section 3. I’m going to highlight that, click on the Link icon, forward slash (/), URL Slug for the page - which is title, forward slash (/) again, the Hashtag (#) symbol – this is really important – remember to add that - and then the URL Slug for that section - in this case, section-3. I’m going to click Add Link and Save, and now I can show you what this looks like.

I’m going to just click this little Arrow top left so that I can view everything. Now, you can click Section 2 and it’s going to drop down to that Section. If we scroll up and click on Section 3, it’s going to automatically drop down to that Section.

That’s it for this video. As you can see, it’s pretty simple to add Anchor Links in Squarespace. If you have any questions at all, just leave those for me in the comments below. I hope that you liked this video. If you did, let me know by giving it a thumbs up, and remember to subscribe and hit that little Bell icon.

If you are building your website with Squarespace – you’re watching this video, so I assume that you are – I would love to help you out. You can get a free trial of my online course, Website That Wows. I’ll leave a link to that in the description below. This is my easy, step-by-step program to get you launching your gorgeous, professional Squarespace website.

That’s it for me today. I’ll see you soon.

You can sign-up for a free trial of Squarespace here. Use the code SIDEKICK10 for 10% off your first year!

Will you be using anchor links on your website? ✨Let me know below! ✨

GET YOUR FREE ROADMAP HERE: