Jump to content

customise anchor links in navigation

Go to solution Solved by paul2009,

Recommended Posts

Site URL: https://lenexis-foodworks.squarespace.com/

https://lenexis-foodworks.squarespace.com/

pw: lenexis.

 

I have created anchor links in navigation (about, order here, brands etc.) They jump fine when operated from the homepage. But when I click on "Inquire Now" in the navigation, which is another page, I'm unable to go back to any of those sections from this new page and the only clickable navigation title is the home title which is the main page I've designed.

 

Can someone help shed some light on this please as this is my first time using anchor links.

 

Thanks.

Link to comment
  • Solution
On 7/14/2022 at 12:28 PM, atfirstblink said:

I have created anchor links in navigation. They jump fine when operated from the homepage. But when I click [them from another page] I'm unable to go back to any of those sections

This is because your anchor is simply "#order" and doesn't include the full path to reach the anchor on a specific page. Because of this, it uses a location relative to the visitor's current page.

This means that when they are viewing the homepage, the anchor link will translate to a valid anchor on the homepage at:

https://lenexis-foodworks.squarespace.com/#order

However, if they are viewing the inquire-now page, the link will be represented by the relative path "#order" being added to the current page name, so it will become:

https://lenexis-foodworks.squarespace.com/inquire-now#order

This results in them trying to go to 'order' anchor on the 'inquire-now' page, but of course it doesn't exist on that page.

Edited by paul2009
edited for clarity

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment

 

@paul2009

Ok but when I insert the titles as links like you suggest i.e. lenexis-foodworks.squarespace.com/#order they lead to the section from the inquire now page but do not jump to the relevant section from the homepage as they do now and the homepage stays static. 

 

If you see https://cartesianconsulting.com/ and the seperate page http://cartesianconsulting.com/careers/ one can jump to the different sections of the homepage right from the careers page. Is there a way to achieve this on squarespace?

 

Edited by atfirstblink
Link to comment

You can do this by replacing your anchor-only link ("#order") with the full path URL that includes:

  • the prefix (https://)
  • the fully qualified domain name
  • the path ("/")
  • the same anchor that you were using ("#order")

For testing this would be https://lenexis-foodworks.squarespace.com/#order as I mentioned above. Have you tried this?

image.png.77b629ffa0b000a7a0779d7951199288.png

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment
On 7/17/2022 at 6:45 PM, paul2009 said:

You can do this by replacing your anchor-only link ("#order") with the full path URL that includes:

  • the prefix (https://)
  • the fully qualified domain name
  • the path ("/")
  • the same anchor that you were using ("#order")

For testing this would be https://lenexis-foodworks.squarespace.com/#order as I mentioned above. Have you tried this?

image.png.77b629ffa0b000a7a0779d7951199288.png

Yes I have tried this. In doing so the anchor links do not jump to the relevant section when clicked on the navigation titles from the homepage. @paul2009

Link to comment
3 hours ago, atfirstblink said:

In doing so the anchor links do not jump to the relevant section when clicked on the navigation titles from the homepage.

I don't know why that would be. When I use the recommended link, it jumps to the correct section for me on both the homepage and the contact page 🙂

See below:

image.png.d3dd5c18a4e1b2acf59fad1f259d790f.png

image.thumb.gif.cee5be1d15cff591c619290c5b0afe58.gif

 

image.thumb.gif.8c620670016dc2694d13a6ac8b69cfea.gif

If this isn't working as you expect, I recommend you follow up with Squarespace Customer Care.

About me: I've been a SQSP User for 18 yrs. I was invited to join the Circle when it launched in 2016. I have been a Circle Leader since 2017. I don't work for Squarespace. I value honesty, transparency, diversity and good design ♥.
Work: I founded and run SF.DIGITAL, building Squarespace Extensions to supercharge your commerce website. 
Content: Views and opinions are my own. Links in my posts may refer to SF.DIGITAL products or may be affiliate links.
Forum advice is free. You can thank me by clicking one of the feedback emojis below. Coffee is optional.

Link to comment
On 7/19/2022 at 2:32 PM, paul2009 said:

I don't know why that would be. When I use the recommended link, it jumps to the correct section for me on both the homepage and the contact page 🙂

See below:

image.png.d3dd5c18a4e1b2acf59fad1f259d790f.png

 

image.thumb.gif.cee5be1d15cff591c619290c5b0afe58.gif

 

image.thumb.gif.8c620670016dc2694d13a6ac8b69cfea.gif

 

If this isn't working as you expect, I recommend you follow up with Squarespace Customer Care.

ok @paul2009 Thank you so much for your help and taking the time to check it out 🙂

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.