How to Create Anchor Links in Squarespace 7.1
Anchor links are a simple and effective way to guide your website visitors smoothly through your content. Instead of making clients scroll endlessly, anchor links let them jump directly to the section you want them to see.
When to Use Anchor Links
Anchor links are perfect for long pages or one-page websites. A common example is an “Explore” or “Learn More” button. When clicked, it can smoothly scroll visitors to a specific section, like a services overview, portfolio showcase, or FAQ section.
Other situations where anchor links are helpful:
FAQ pages, to jump directly to specific questions
Pricing tables, linking directly from call-to-action buttons
Blog posts, to link to key sections within a single article
How to Add an Anchor Link in Squarespace
To create a button or text link that scrolls to a specific section on your page, follow these steps:
1.Add an HTML Block at Your Target Section
Edit the page and add an HTML block where you want the link to land.
Insert the following code:
<div id="services"></div>
Replace
serviceswith a word that matches your section, such asabout,contact, orteam. For example:<div id="about"></div>
2. Link Your Button or Text to the Target Section
Select the button or text that will act as the anchor link.
Click the link icon and type
#services(replaceserviceswith your chosen ID). This tells Squarespace where to scroll when the link is clicked.
3. Test Your Anchor Link
Click Save and preview the page.
Click your button - it should scroll smoothly to the section with your HTML block.
If it doesn’t work, double-check that the ID in your HTML block matches exactly the ID in your link (IDs are case-sensitive).
Tips for Anchor Links
Keep your anchor IDs short, simple, and descriptive.
Place the HTML block exactly where you want the link to land, so visitors see the intended content immediately.
Anchor links work best for long or one-page websites, enhancing navigation and user experience.
Using this method ensures precise control over where your anchor link lands and keeps the experience smooth and professional for your visitors. An “Explore” button that scrolls straight to your services or portfolio can make your site feel polished and engaging.