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.

Do

Don't

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 bristol.ac.uk domain, you can use a 'relative' URL which means you don't need the http://www.bristol.ac.uk 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.