How to Add an Anchor Link to your Squarespace Website

A website editing interface with a background featuring shades of brown and gold. The main content reads "FIND ME THE DIS" in large, bold, gold-colored letters, with smaller red text "COMING SOON" above it and smaller gold text "A NOVEL" below. There is a code editor open on the right with a div element labeled "book."

If you have a one-page website that continuously scrolls down the homepage, you’ll probably need to use something called Anchor Links or Jump Links.

You’ve likely used an anchor link on recipes you’ve found online. They’re usually close to the top of the page, and let you jump all the way down the page where the recipe is actually located—after all the flowery text from the author that helps boost their recipe on Google’s search engines.

Follow this guide to edit or create your own anchor links on your Squarespace website.

Website landing page with the message 'Coming Soon, Find Me at the Disco, A Novel' in large yellow text on a dark brown background, with a menu on the left side with various icons and labels.

Add a code block to the section you want to jump to

Go to your Squarespace website dashboard and click Edit.

Select the page you’d like to add the anchor link to, and scroll to the section where you want to add it.

Hover over the lefthand side of the section until a button appears that says Add Block.

Click on Code to add a code block.

Drag the code block to the position you’d like the anchor to jump to.

2. Add the anchor code

Website homepage with a brown and gold color scheme, displaying large text 'FIND ME THE DIS' and smaller text 'COMING SOON' and 'A NOVEL'. An overlay with HTML code showing a div element with the id 'book'.

Hover over the code block you’ve just added to your section. Click on the Pencil icon to edit the code.

Add in the following code:

<div id="book"></div>

My anchor ID is book.

You can name your anchor ID anything you’d like. Just replace book in the above code with your unique anchor ID.

In the example below, I’ve changed the anchor ID to worm:

<div id="worm"></div>

HOT TIP

TEXT CASE
- book and Book are not the same. Use the exact text case from your anchor ID in the next step.

3. Create your link (top navigation)

Screenshot of a website editing interface showing page navigation menu with options like Book, About, Contact, and a sidebar with site pages and content categories. The right side displays part of the website with an orange background and text, including the author's name DIHANNA HAMPTON.

To add this anchor link to the top navigation of your site, click on the + icon near Main Navigation and select Link.

A website page with a centered white overlay titled 'Edit Link'. The overlay contains fields for 'Link Title' labeled 'BOOK', and 'Link' with the URL '/home#book'. There are options to close or save at the top, and to delete the link at the bottom in red text. The background shows part of a webpage with the name 'Diahanna Aurora Hampton' and navigation options 'BOOK', 'ABOUT', and 'CONTACT' on a red and yellow gradient background, along with a gray sidebar menu on the left.

Edit the Link Title to what you want this top navigation link to be.

Edit the Link to be:

/yourpage#youranchor

/yourpage is the exact URL slug for the page you’ve created the anchor on.

#youranchor is the exact anchor ID you created in the previous step.

In my example, the link would be:

/home#book

If your anchor ID was worm and you created the anchor ID on your /home page, the link would be:

/home#worm

HOW TO FIND THE URL SLUG FOR YOUR PAGE

Go to your website dashboard and hover to the right of the page name until a gear icon appears. You can see it in the screenshot below:

Screenshot of a website's page settings menu overlay, showing options like General, SEO, Social Image, and Advanced, with page info such as title, navigation title, URL slug, enable page toggle, and password field.

Click into the gear icon and copy the URL SLUG.

4. Create your link (in-text hyperlink)

A digital text editor interface with an orange background displaying a section titled 'ABOUT THE AUTHOR' with text about a person named Diahanna, who graduated in 2014 with a BA in Art Studies from North Carolina State University. The editor shows a formatting toolbar and a pop-up box with the text 'second historical fiction novel' and the location '/home#book'.

Click into a text box and highlight the words you want to add the link to.

Add the anchor link here, and hit Apply.