How to Create Anchor Links in Squarespace
This post may contain affiliate links. Which means if you make a purchase through them, I may receive a small commission at no extra cost to you!
Today we are creating anchor links on your Squarespace website! 🎉
You might want to do this if you have a longer page or you want people to be able to jump to certain sections. So, if somebody lands on my page and they know they want online business management, they can click this and it'll jump to that section on the page. They don't have to scroll to find it.
It's super easy to set up, but it's not very built-in in Squarespace. You have to use a little bit of code, butdon't let that scare you. It's so easy.
And this process works on both the 7.1 and 7.0 website versions. My site is using 7.1, so that’s what I’ll be showing you, but this will work on the older version as well using the same process. So let's get to it.
Creating an anchor link in Squarespace
So, in the video you can see I am reworking my 'Work With Me' page. I'm updating my offers, and I decided to put links to buttons at the top that takes people to that section on the page.
Step One: Add code block
Once you’re logged in, click Edit on the page you’re working and and go to the section you want to link to.
Click to add a code block and add the code below. Note: You want to remove the ‘This is where the link will jump to’ text or it will show on your page.
<p id="unique-id">This is where the link will jump to</p>
Step Two: Rename the unique-id
We want to rename this to whatever you want to call your section. So, I called this 'breakthrough-session'. You can use whatever you want, just be sure to use a dash between words.
Then just click outside of the box to save it and now you've got this invisible code block. I like to make sure that it is at the top of the section because it's going to jump the page to wherever it is.
So, I just like to make it small and push it off to the side or up to the very top of the section. Then click 'Save'.
Step Three: Create the jump link
Now we're going to create the link to that section.
Highlight the text you want to link, or open the button settings for the button you want to use.
The link is actually just going to be your page URL, and then we're going to add that 'breakthrough-session' unique ID to the end of that. So, it's going to look something like this:
https://delanasimmons.com/work-with-me/#breakthrough-session
Make sure that it's not set to open in a new window. Then click 'Apply' and 'Save' again.
Now if you go to your live page and click that button or text link, it will move you down to that section of the page.
So, I hope that you found that helpful and not too complicated, even with a little bit of code. 😉 I will see you next time.
If you’d like a visual walk through of these steps, just click the video at the top of the page. I’ll take you through it in less than 5 minutes. 😃
xx,
Delana
PS: If you’re not sure where you need to start with your business systems, I’ve got a quiz to help you out. It’s 10 questions, super quick and easy. It’ll tell you which system you need to set up first, and you’ll get a tool to help you take action right now, today. Because why waste another minute? Take the quiz →