Markdown is weirdly limited, and you can’t easily create footnotes. You can, however, fake them.1 This post builds on a StackOverflow post and Seamus Demora’s post on Github.

Conceptually, the process is simple: using HTML tags, create a note number and a footnote that link to one another internally. The key is the HTML id attribute, which can be added to any tag. (Some folks use name rather than id, but I found that name didn’t work within the VS Code Markdown previewer, so I use id.)

Concrete examples of adding id to arbitrary formatting tags (a1 is the id of the number; f1 is the id of the note — these names are arbitrary):

  • Note number in text: 
    <sup id="a1">[1](#f1)</sup>
  • Footnote, with return link: 
    <sup id="f1">1</sup>Note text goes here. [↩](#a1)

Concrete examples of using anchor tags, thus separating linking and formatting information:

  • Note number in text: 
    <a id="a1"></a><sup>[1](#f1)</sup>
  • Footnote at bottom of page, with return link: 
    <a id="f1"></a><sup>1</sup>Note text goes here. [↩](#a1)

Conceptually, although anchor tags are more verbose, I like them because they are explicit (and explicit is better than implicit).

1You might be asking yourself, “How is it possible that we are still hand-coding HTML in 2022? Did a time machine take me back to the 1990s?” Both good questions.↩