How to link to a specific point on a web page

Applies to: Plone, T4 Site Manager
Last updated: 17/10/2016
Summary: How to add links to specific points on a web page. These are also known as anchor links or jump links.



Create the anchor

Start by giving each place you want to link to (the anchor or target) a unique id. The anchor will normally be a heading further down the same page or a heading on a separate page, but in some cases could be the start of a paragraph.

To add the unique id to the heading you want to link to, do so via the HTML view using this format:

<h2 id="heading1">This is the first heading</h2>

Each id on the same page needs to be unique (eg heading1, heading2, etc). Use lowercase, no spaces or special characters apart from hyphens, eg id="heading1" not id="heading 1".

Link to the anchor

Once you have created the anchor(s), use the text editor to add the link(s):

  1. Highlight the words you want to link from
  2. Choose the Insert/edit link icon 
  3. If you are linking to an anchor on the same page: add the id you created, preceded by a #, eg #heading1 - you don't need http:// or www or / - then click the Insert button.

  4. If you are linking to an anchor on another page: add the id you created, preceded by the URL of the page it's on, plus a #, eg /style-guides/web/how/edit-content/#heading1 - then click the Insert button. Note that if the page you are linking to is within the domain, you can use a 'relative' URL which means you don't need the part, but it must start with a /

Note: you cannot use anchor links with the 'Insert Section Link' option - you must link to the anchor as described above.