Adding Anchor Links on Squarespace
Adding anchor links to a Squarespace website is a great way to help visitors navigate to specific sections of your page. Here's how you can add anchor links to your Squarespace website:
First, navigate to the page in Squarespace where you want to add the anchor link.
Highlight the text or select an image that you want to link to the anchor, and click on the link icon in the text editor. You can also add anchor links to the navigation by adding a new link in the Pages menu.
In the link editor, click on the "Link to URL" option and then type in the anchor link that you want to use. For example, if you want to link to a section on the same page, you would type in "#section-name". If you are doing this in the navigation (and have multiple pages) you will want to add the URL Slug as well, like this: "/page-slug/#section-name"
(Replace "section-name" with a name for your section, such as "about" or "services".)To create the anchor link, you will need to add a code block to the page. Click on the "+" icon in the text editor and select the "Code" block from the menu.
In the code block, type in the following code:
<a id="section-name"></a>
(Replace "section-name" with a name for your section, such as "about" or "services".)
In Fluid Engine you are best off putting the code block at the top of the section, and behind any content that is already at the the top, do this for desktop and mobile layouts.Click on "Apply" to save your changes.
You can now use this anchor link anywhere on your website. Simply highlight the text or image that you want to use as the link, and select the "Link" option in the text editor. Then, select the anchor link that you created from the "Internal" tab of the link editor.
We can also animate the movement to the anchor link by adding this to the Custom CSS:
html {
scroll-behavior: smooth;
}
By following these steps, you can easily add anchor links to your Squarespace website and make it easier for visitors to navigate to specific sections of your page.
