Jump to content

Cant get anchor links to work in navigation

Recommended Posts

Hi! I have tried every online tutorial for this. I know how to create an anchor link in the code block and I know how to add it as a "link" to the navigation, but it does not work. It doesnt do anything when I click the link.

I am trying to create "jump links" in my navigation that jumps to sections of the homepage. I just have one continuous page and dont want separate pages.

Any advice? 

website: www.gtmenabler.com

Example of what I tried: 

 

Link to comment

Hi!

For using anchor links, you can use codeblocks to insert the links on your homepage and then simply add them to your navigation.

Steps:

1. Insert the following code (in a code block) to the section where the navigation link should jump to (this id has to be unique):

<p id="link"/p>

2. Then, add a link to the navigation containing "/site-name#link" (e.g. /home#link)

 

 

Link to comment
56 minutes ago, SimonZSImon said:
<p id="link"/p>

This needs a couple more angle brackets:

<p id="link"></p>

<span id="link"></span>

and you may want to use span instead as it doesn't have a line-height associated with it.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

I'm not sure what's going on in your video. My guess is that you have the line height for the navigation set to zero, but I also don't see the strikethrough or the misalignment of the navigation with the social icons.

This is a good guide to follow in general for anchor links:

https://www.will-myers.com/articles/perfect-anchor-links-in-squarespace

It will help you add a smooth scroll and offset.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
  • 1 month later...

Ziggy thank you, you helped out when nothing I found online or the help center could. I'm assuming it's because I'm trying to use it in the test window, but sometimes the anchors work just like they should and then sometimes they just don't do anything, but my site is still private and I haven't tested it in the wild yet. Just curious as to why they'd work in the in-cognito editor once and then stop. 

Link to comment
12 hours ago, ArcherDougherty said:

Just curious as to why they'd work in the in-cognito editor once and then stop. 

Cache would be my first guess, that's the major difference in using an incognito window. You can try clearing your browser cache to see if that makes a difference.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.