Skip to main content Skip to secondary navigation

How do I use jump links to create footnotes?

Main content start

A footnote is a short piece of text, often numbered, placed at the bottom of a printed page, that adds a comment, citation, reference etc, to a designated part of the main text.1

Here is an approach for adding footnotes to pages on your website that uses jump links. You might want to read up on how to create jump to links2 before getting started here.

  1. Add a horizontal line at end of the text for your page.
  2. Add the text of your footnotes each with its unique number below the horizontal line.
  3. Use the anchor functionality (🏴) to add an anchor link to the unique number on the footnote. 
    • Tip: Use a machine readable naming scheme such as page_number to uniquely name each anchor link.
      E.g., Barnes_Study_1 
  4. Scroll back up on the page and place the footnote reference in your text.
  5. Use the link functionality to create a link from the footnote reference to the footnote. With both the text and the footnote on the same page, you identify the link by prepending a '#' to the name of the anchor link.
    E.g.,  #Barnes_Study_1
    which will create <a href="#Barnes_Study_1">1</a>
  6. Apply the superscript functionality "x2" on the footnote reference.
  7. Repeat these steps for each footnote reference you want to include on your page.