How to Set Up Anchor Links on Squarespace
TL;DR:
- Anchor links let users jump to specific sections of a page, improving navigation
- Available on Squarespace 7.1 only (7.0 users need workarounds)
- Works with most sections but not blogs, events, portfolios, or stores directly
- You can create "top" and "bottom" anchor links for long pages
- Always test your links after setting them up
Anchor links (also called "page jumps") are URLs that take visitors directly to specific spots on a webpage. They're brilliant for long pages where you want people to skip straight to the information they need.
What Sections Support Anchor Links
On Squarespace 7.1, you can add anchor links to:
- Block sections
- Auto layouts
- Course sections
- Gallery sections
- Video sections
You can't add them directly to blog, events, portfolio, or store sections. But there's a workaround for this that we'll cover below.
Setting Up Basic Anchor Links
Step 1: Create Your Anchor Link
- Click "Edit" on your page
- Select the section you want to link to and click "Edit Section"
- In the Anchor Link field, type your desired slug (spaces automatically become dashes)
- Click the "Copy Link" icon to save the URL to your clipboard
The URL format will be: /pageslug#anchorlinkslug
Step 2: Create Your Navigation Link
- Add a text block where you want the clickable link to appear
- Type the text you want to turn into a link
- Highlight the text and click the link icon in the toolbar
- Paste your copied URL
- Choose whether to open in a new tab (usually you'll want this off for anchor links)
- Hit Enter to confirm
Step 3: Save and Test
Click "Save" to activate your changes. Test the link to make sure it takes visitors to the right section.
Special Cases
Linking to Top or Bottom of Page
For long pages, you can create quick navigation:
- Top of page: Add the anchor slug 'top' to your first section
- Bottom of page: Add the anchor slug 'bottom' to your last section or footer
Working Around Unsupported Sections
If you need to link to a blog, store, or other unsupported section:
- Add a blank section just above your target area
- Set up the anchor link on this blank section instead
- Adjust the blank section's visibility settings so it doesn't interfere with your design
This gets visitors close enough to your intended destination.
Squarespace Version Differences
Squarespace 7.1: Full anchor link support as described above.
Squarespace 7.0: No built-in anchor link feature. You'll need to use code blocks with custom HTML or set up index page anchor links instead.
FAQs
Can I add anchor links to any section on my Squarespace site?
Most sections support anchor links, but blogs, events, portfolios, and stores need the blank section workaround.
Can I customize my anchor link slug text?
Yes, but it can't contain spaces. Squarespace automatically replaces spaces with dashes.
What happens if I change my domain or page slug later?
You'll need to update your anchor links to match the new URLs, or they'll stop working.
Do anchor links work on mobile?
Yes, they work the same way on mobile devices as on desktop.
Jargon Buster
Anchor Links: URLs that take users directly to specific sections of a webpage, rather than just the top of the page.
Slugs: The text part of your URL that comes after the # symbol, identifying which section to jump to.
Page Sections: The building blocks of your Squarespace page where different types of content live.
Code Blocks: Special sections in Squarespace where you can add custom HTML or plain text code.
Wrap-up
Anchor links make your Squarespace site much easier to navigate, especially on content-heavy pages. They're straightforward to set up on version 7.1 and work well for most sections. The key is testing your links after you create them and keeping them updated if you change your site structure.
For version 7.0 users, the lack of built-in anchor links is a limitation, but there are coding workarounds available if you need this functionality.
Join Pixelhaze Academy to master more Squarespace techniques and keep your skills sharp.