Use Anchor Links to Jump Down a Different Page

In a previous video, I showed you how to add anchor links to jump the visitor down the page to a designated spot.

However, there may be times when you need the link to jump them to a specific spot on a different page.

The following video goes into how to use the code block to add anchor links that jump you to a specific spot on another page of your Squarespace Website. The code used in the video is provided below.

 
 

The following code is used in the video.

Anchor

<div id=”idname”></div>

Link to Anchor

/pagename#idname
 

UPDATE: Anchor Links in Squarespace 7.1 can be tricky. If the above code is not working, try adding the following to Settings > Advanced > Code Injection > Header

<!-- Anchor Links -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<script>
$(document).ready(function() {
$('html, body').hide();

if (window.location.hash) {
setTimeout(function() {
$('html, body').scrollTop(0).show();
$('html, body').animate({
scrollTop: $(window.location.hash).offset().top
}, 1000)
}, 0);
}
else {
$('html, body').show();
}
});
</script>
<!-- End of Anchor Links -->
 
 
Rebecca Grace

Rebecca Grace is a Squarespace CSS Expert and Website Designer.

https://rebeccagracedesigns.com
Previous
Previous

Edit the Banner Image on Mobile in Squarespace 7.0

Next
Next

Add a Page Loading Screen to Squarespace