Linking to Anchors or Sections in other pages

Hi - anyone know how to link to a section in another page? This question was asked in another post, but after trying the solution that was suggested, it’s still not working for me. Any ideas?

Thanks!

4 Likes

Eg.
page url: /newpage

section on that page: #newsection


go to link settings, set up url as: newpage#newsection

1 Like

We don’t have the functionality yet to choose a section on a specific page yet, but we want to add that in.

As @bartekkustra mentioned right now it will work if you add your page name and section like this in the URL tab: /page#section. The downside of this is if you change your page name or anything else it won’t automatically update that URL.

2 Likes

Thanks @bartekkustra and @thesergie, but I’ve tried that and for some reason it’s not working for me…

can you give us a preview link to your project?

Ok, back on this project after a hiatus, and still having this issue.

So, I’m trying to link to a section on my home page with an ID of “how-it-works” from another page. If I understand correctly, you’re saying to structure it like this in the URL field, under Settings:

/index.html#how-it-works

However, when I do this, I get a “Sorry, index.html does not exist” page. Same result if I remove the leading “/”.

Any ideas? Thanks!..

1 Like

Did you define the section on the index.html page?

Having the same problem described by Bulleit.
Section on a page called “services” has been assigned the ID of “consulting” (and a tag of “Section”, if that matters).
A button on the Home page is then hyperlinked to “/services.html#consulting”
but I get a 404 error when I click the link.

I got this to work when I published the site to Webflow (haven’t tried it yet when exporting the site):

  1. Assigned an external link to the button under link settings
  2. Entered the entire URL in the field, ie: http://subdomain.webflow.com/#[ID name]

I wanted the button to take the user back a specific section on the home page, and it seems to work fine.

+1 on this request to include the functionality to deep link to an anchor on another page!

1 Like

Hello,

Was wondering if there is any update regarding this functionality…? Would be great to have it!

Thanks!

1 Like

Do you need the page extension? For example, just use the linking tool and type in: /the-page.html#anchorHere

Can you please verify? I am still in staging, and if I do not know for certain, I may just fall back including an absolute URL.

Thank You!

Hey @Tine22 great question! Yes you would need to type in the page extension and remember that ID’s are case sensitive and will only work on the published site (so at your webflow.io subdomain version or published site at the custom domain). :slight_smile:

​Please let me know if this is helpful, if not, I’m happy to help further. :slight_smile:

Ok, so I cannot really accurately preview this till it goes live to production. is that correct?

Thank you!

You can preview it if you publish your site to the Webflow.io subdomain. @Tine22

Is that an included test server in which to view the site?
Where do I go in Webflow to do that? Is it hidden from the public and won’t get cached in search engines?

Hey @Tine22 great question!

Whenever you go to Publish a Webflow site, you can select to publish your site to sitename.webflow.io :smiley:

You can also set your subdomain to not be indexed by following the directions available here:

And if you have a Professional plan or above you can add password protection to your site:

​Please let me know if this is helpful, if not, I’m happy to help further. :slight_smile:

So, the anchor links to named ID in section on another page (case sensitive and noted in all lowercase, no spaces) is not working. It jumps to the 401 page instead.

domain.com/my-page.html#portfoliogrid

Any other ideas to make that work? Wondering if the page name extension is tripping it up, possibly?

Should mention, I have it going to the sub-domain right now for testing, but I can see the URL correctly cited.
Wondering if as a last resort, using an absolute URL (manually listing in entirety) in the linking field would be best?

Let me clarify for all how this is done correctly.

You do NOT include the file extension (.html) at all when anchoring out to a div or section on another page in your site.
You will get the 404 error message.

For the record for any new Webflow users, here is how it is done.

  1. assign the div an ID name to better identify that particular content block. In some cases you may need to first assign a custom class name to the div in question before having the opportunity to also assign it a unique ID.
  2. create your hyperlink to go to an external page, so that you get the blank field, and type in the anchor like this: /services#help

That will do it!