Applet Studio

View Original

New Easy Way to Add Anchor Links in Squarespace (2025)


Using Anchor Links for Better User Experience


An anchor link is a type of link that takes you to a specific section within the same page. Think of a table of contents in a long blog post that lets you jump to a subheading instantly. It’s essentially a “page jump” that enhances navigation and user experience.

Adding anchor links can be particularly helpful on long-scroll pages, such as Home, Services, or Sales pages, making it easier for visitors to find the information they need without endless scrolling. In a way, it can indirectly benefit SEO of a given website. When users can easily find / get to information they came for, they spend more time on the page and the bounce rate (users leaving after seeing only one page) is reduced.

Anchor links have always been tricky to implement on a Squarespace website, as they’re not an obvious feature and often require following a tutorial. The good thing is that in 2024 Squarespace simplified the process. Adding anchor links no longer requires using code blocks, making it much more accessible for people without coding skills.

How to use anchor links in Squarespace

We’ll guide you step-by-step on how to add anchor links to your Squarespace website. For this tutorial, we’ll use a sales page from our Social Motion Squarespace Template as an example. Specifically, we’ll show you how to click a button in the second section of the page and scroll directly to the Pricing Plans section, located near the bottom of the page.


  1. Name the section of your Squarespace website

Firstly, we need to name the section we will jump to. You can choose any name, but it’s better to be short and concise. The section name will become its unique ID, so it can be used only once per page. Avoid spaces; instead, separate words with dashes, similar to how links are formatted on the web.

Previously, to give the section its ID we had to use a code block. But with Squarespace’s recent update, we received anchor link innate functionality.

Click Edit to make changes to the page, scroll down to your section, click Edit Section, and scroll down the Design tab to find the Anchor link text field. Type in the name of the section here, for example, we named it “pricing-options”. Click the copy icon next to the text field.


Create the anchor link to use on your Squarespace website

Now the copy option provided by Squarespace is very useful, because it generated the full version of the link for us, which is: https://socialmotionbyapplet.squarespace.com/course#pricing-options.

If you take a closer look at it you will see that it consists of three parts:

  • page slug with a slash /courses

  • section ID with a hashtag #pricing-options

When we use page jump on the same page we only need the last two parts – page slug and Section ID. But you can also use the long link if you want to.

Now I am scrolling back up to the button in the second section of the page. In the page Edit mode click the button, click the pencil icon, click attach link, and type in the page slug and the Section ID (or paste the link). Click Save at the top left of the page and check your link, it should work.

You can also add the anchor links to text and images using the same logic.


Anchor links are now enabled your Squarespace website

Now you know how to easily add anchor links to your Squarespace website, making navigation smoother for your visitors and enhancing the overall user experience! Whether it’s buttons, text, or images, linking to specific sections on the same page is now a straightforward process thanks to Squarespace's 2024 update. Say goodbye to complicated code blocks and hello to better site usability – your visitors and your SEO will thank you!


Shop Squarespace Templates:

See this gallery in the original post