Jump to section works great, but jump to a section on another page isn’t yet an easy thing to do in Webflow.
For the moment, I select the target page in the dropdown menu, switch to the first tab (free link) where I instantly find the link to the page I selected in the dropdown (handy) and add #section_ID. It’s not so bad, but if I change something like a page name or slug, it will break.
Thanks for your post. I’m new to Webflow and I am having trouble following your instructions. Here’s what I’m trying:
I want to jump to my ‘Contact’ section on my homepage. I’m navigating from a gallery item detail page. I click on the button in my navigation menu ‘contact’ → go to ‘settings’ → link settings → I choose the tab ‘a different page’ → choose the page ‘Home’ from the dropdown menu → go to the tab ‘External website URL’ (with the link icon) → In the input field, I see a forward slash (‘/’) → Now what?
I’m supposed to add something to the input field right, but what exactly. Nothing I’ve tried seems to work’
This doesn’t seem to work for me, but I’m in demosite mode so this could be the problem?
This what I’ve tried so far:
I’ve got a single page Homepage and a gallery item detail page. From the detail page, I want to have a button to go back to the homepage and then scroll down to a specific section (contact for example). I’ve tried making a button on the detail page called ‘contact’. I then add a url next to the link/chain icon of https://webflow.com/design/demositeleo/#Contact. I haven’t checked the ‘open in a new tab’ checkbox, but somehow it DOES open in a new tab and it doesn’t scroll down to ‘Contact’.
Directions for Linking to a Section/Element/Div Block:
Double/Triple Click the section you want to link to:
Add an ID to specify the name of section (in your case Contact).
I’ll also had that if you’re still having a hard time with this, make sure you don’t have a section with the same name on the page you’re linking out of. I just spent an hour trying to figure out why this simple thing wasn’t working for me - doh!
Hi,
I’m struggling with getting these links to other pages working on my hosted site even though they work on the preview (mydomain.webflow.io) page.
My links are setup like this - /articles/#Holding_Back and link to an area marked as “Holding_Back” on my page with a slug of “articles”. As I say, on the preview page it functions correctly but on my hosted page with the proper domain I see an error “The requested URL /articles/ was not found on this server.”
Hi, links to other pages sections IDs have to be written in full starting with http:// with the full domain and path. Also, the #ID part has to follow immediately the url, without a “/” before.
I changed the links and I’m still seeing the issue. Slightly different example but when I hover over the image on my published site I see the link as “http://www.top-box.co.uk/articles#should_you” but when I click on it I get the error message “The requested URL /articles was not found on this server.”
I did change the SEO name of my website yesterday. Would this mess things up? When I check the slug value for the articles page it shows as “articles” and the link below says “website.com/articles”. The actual hosted page “http://www.top-box.co.uk/articles.html” seems to load OK and when I check the source I can see this " "
I have just noticed that it affects other links on my site so i’m wondering if the name change has cuased this but don’t know how to correct it
Thank you once again Vincent, you were correct. I just had to be more specific about my link. Including .html the the end of the page name makes it all work as I had hoped
So far I can’t see a way to prevent the links opening in a new tab, despite NOT having the checkbox selected. Does anyone have a tip on how to prevent links to other page sections opening in a new tab?
@carlcankite - This can be a browser level user preference specified in the browser preference pane ( Chrome / Safari / IE ) to have all links open in a new tab / or open in a new window / block popups. Be sure to check settings as they will always override any link behavior regardless of the way the URL is constructed.
Hi,
I did what you said: using a link with an url with #contact.
This works but open and show the section contact, but IN A NEW WINDOW!! Without checking “open in a new window”…
Hi Alex,
I did what you said: using a link with an url with #contact.
This works but open and show the section contact, but IN A NEW WINDOW!! Without checking “open in a new window”…