How to Link to a Section in Squarespace (Without Code)
Did you know you can link to a specific section of the page on your Squarespace website without using code? Thanks to the recently added anchor links feature, you can easily have a button or link on your website scroll to a specific section of the page. You can use this feature to either link to sections within the same page or to link to a specific section of another page on your website.
Note: the anchor links feature is only available on 7.1 Squarespace websites.
How to Create the Anchor Link
The first step is to choose the section you want to link to. Click on the Edit button to go into edit mode and scroll down to the section you want to link to. Hover over the section and click the Edit Section button.
In the Section Settings popup, under the Design tab, scroll all the way down until you see the Anchor Link option. Name the section whatever you want to reference it as. This link will be added to the end of the URL, meaning your website visitors will be able to see it, so make sure it is something clear and relevant to the section. This anchor link will also need to be unique – meaning you can’t have another anchor link with the same name somewhere else on your website. Also you can’t use spaces here, but you can use dashes in place of the spaces.
Using the Anchor Link to Jump to a Section
Now that your anchor link is created, you can add it to any button or text link on your site. In the anchor link text box, click the copy icon to the right to copy the link. You’ll want to use this icon because it should* automatically format the link for you when you go to use it.
While in Edit mode, select a button or text you want to turn into a link, and click on the link icon to open the link settings. In the URL box, paste the anchor link. It should be pasted with a slash and hash symbol, e.g. /#your-anchor-link.
If you are linking to it from another page, it should also include the URL slug of the page that contains the anchor link (before the hash symbol). If you copied the anchor link using the Copy icon as I mentioned above, it should automatically include the URL slug for you.
So for example, let’s say you have a section on your Services page with an anchor link of #packages-and-pricing, and the URL slug of your Services page is services. And let’s also say you want to link to that section from a button on the home page of your website. The button link should be: /services#packages-and-pricing.
If for some reason it’s not automatically including the page URL slug, you can type it in yourself. You can find the page URL slug by going into the page settings – over in the Pages panel on the left side of your dashboard, hover over the page that contains the anchored section and click the settings icon that appears to the right of the page title. You should see the URL slug in the General tab.
*Sometimes when I use the copy icon in the anchor link text box, when I go to paste the link it includes the built in Squarespace domain. For example, one time it pasted “https://contrabass-crow-3w4s.squarespace.com/#contact-us” → THIS IS NOT CORRECT! You should never use the built-in Squarespace domain in any links (the built-in Squarespace domain is the URL you see in the address bar when logged in to your Squarespace website dashboard that ends in “.squarespace.com”). I have seen some beginners include this link in buttons on their website, and it will not work. Your built-in domain is not public, it will only work for you (while you are logged in to your Squarespace account). Hopefully Squarespace will fix this bug with anchor links, but in the meantime just double check you are using the correct link – in the example above, it should have just pasted /#contact-us.
Testing the Anchor Link
I’ve found that if you click the anchor links from within your Squarespace dashboard, it doesn’t always work very well. To get around that, the best way to test it is to preview your live site. Your live site is always the main source of truth of how things will look to website visitors. While I’m editing, I usually have a separate tab open with my public website URL, i.e. jen-webb.com, to test changes. If you don’t have a domain set up yet, you can follow the steps here to preview what your live website will look like.
