CODEWITHSUNDEEP
markdowngithub-flavored-markdownmultimarkdown
Enrico Susatyo
Enrico Susatyo

Reputation: 19790

How to add footnotes to GitHub-flavoured Markdown?

I am just trying to add footnotes in my GitHub Gist, but it doesn't work:

Some long sentence. [^footnote]

[^footnote]: Test, [Link](https://google.com).

I am following this guide and I don't think I'm doing anything wrong. Can someone point out my mistake?

Upvotes: 383

Views: 149494

Answers (15)

Jp_
Jp_

Reputation: 6173

I recently found out what it seems to be a cleaner solution. I started to use Asciidoc instead of Markdown. It has the same functionalities of Markdown and some additional ones. To include a footnote you simply add footnote:[My note text].

For instance a text like this:

:toc: 
:toc-title: summary

== Title
My content.

=== Subtitle

Another content.footnote:[My footnote.]

- bulletfootnote:[It enumerate automatically.]  
- points
- items

is rendered to

enter image description here

Upvotes: 0

VonC
VonC

Reputation: 1323343

Sept. 2021: Footnotes are here!

(Dec. 2021, as commented below, wiki README.md does not yet support footnotes)

"Footnotes now supported in Markdown fields"

Footnotes let you reference relevant information without disrupting the flow of what you're trying to say:

Here is a simple footnote[^1]. With some additional text after it.

[^1]: My reference.

You can now use footnote syntax in any Markdown field!

Footnotes are displayed as superscript links. Click them to jump to their referenced information, displayed in a new section at the bottom of the document:

https://i1.wp.com/user-images.githubusercontent.com/2503052/135463148-0231966e-8631-41a1-b1a7-66746100d20a.gif?ssl=1

Cf. Documentation.

In Oct. 2023, Greg Sadetsky mentioned in the comments:

footnotes work well! But not in markdown file headings i.e. # heading [^1] (followed by the footnote content) renders the [1] part in the markdown file heading as "full" text, not elevated with a <sup>. I opened an issue in github/markup issue 1728.

July 2024: that issue is now closed as completed. The [1] is elevated with a <sup>, even in headings.

Upvotes: 48

Seyma Kalay
Seyma Kalay

Reputation: 2859

I was looking for the same and I came up with the following, which is a footnote and opens the link in an external tab.

myfootnote^[Please see at: <a href="copylink" 
target="_blank">copylink</a> ]

Upvotes: 0

corngk
corngk

Reputation: 41

This one works on Kaggle notebook markdown:

Tell the story here.[<sup>[1]</sup>](#f1)

<span id="f1">[1]</span> Detail reference here.

Upvotes: 0

asmaier
asmaier

Reputation: 11746

Unfortunately the footnotes as supported by github (see this answer) don't support rendering of latex, see https://github.com/orgs/community/discussions/55227 .

My way of adding footnotes to a document therefor is

This is the first sentence. <sup id="a1">[1](#f1)</sup>

This is a second sentence. <sup id="a2">[2](#f2)</sup>

---

#### Footnotes
> <sup id="f1">1</sup> Pythagoras theorem $a^2+b^2=c^2$ [⏎](#a1)

> <sup id="f2">2</sup> See [De_Gua's_theorem](https://en.wikipedia.org/wiki/De_Gua's_theorem) [⏎](#a2)

The advantage of formatting footnotes as quotes using > is that this will render them in a grey instead of black to better distinguish them from the main text.

Upvotes: 2

Eli Holmes
Eli Holmes

Reputation: 676

I used a variant of Mateo's solution. I'm using this in Rmd files written in github flavored markdown (gfm) for a Jekyll powered website but the same Rmd files are being used to produce pdfs in various contexts. The Rmd files are math heavy and the math is displayed with MathJax on the website. So I needed a solution that works with gfm that is processed via Jekyll, works with pandoc->pdflatex, and is compatible with MathJax.

snippet from Rmd file (which is gfm)

Here is a paragraph with an footnote <span id="a1">[[1]](#f1)</span>.

Footnotes
=========

1. <span id="f1"></span> This is a footnote. [$\hookleftarrow$](#a1)

$\hookleftarrow$ is latex, which works for me since I always have MathJax enabled. I use that to make sure it shows up correctly in my pdfs. I put my footnotes in square brackets because superscript is confusing if I am putting a footnote on some inline math.

Here it is in action: https://eeholmes.github.io/posts/2016-5-18-FI-recursion-1/

These notes can be put anywhere in the Rmd. I am putting in a list at the end so they are technically endnotes.

Upvotes: 8

Scott Gardner
Scott Gardner

Reputation: 8739

Here's a variation of Eli Holmes' answer that worked for me without using latex:

Text<span id="a1">[¹](#1)</span>

<span id="1">¹</span> Footnote.[⏎](#a1)<br>

Example

Upvotes: 10

Rich Traube
Rich Traube

Reputation: 161

For short notes, providing an anchor element with a title attribute creates a "tooltip".

<a title="Note text goes here."><sup>n</sup></a>

Otherwise, for more involved notes, it looks like your best bet is maintaining named links manually.

Upvotes: 13

Mars
Mars

Reputation: 8854

I wasn't able to get Surya's and Matteo's solutions to work. For example, "(#f1)" was just displayed as text, and didn't become a link. However, their solutions led me to slightly different solution. (I also formatted the footnote and the link back to the original superscript a bit differently.)

In the body of the text:

Yadda yadda<a href="#note1" id="note1ref"><sup>1</sup></a>

At the end of the document:

<a id="note1" href="#note1ref"><sup>1</sup></a>Here is the footnote text.

Clicking on the superscript in the footnote returns to the superscript in the original text.

Upvotes: 19

Matteo
Matteo

Reputation: 2577

Expanding on the previous answers even further, you can add an id attribute to your footnote's link:

Bla bla <sup id="a1">[1](#f1)</sup>

Then from within the footnote, link back to it.

<b id="f1">1</b> Footnote content here. [↩](#a1)

This will add a little ↩ at the end of your footnote's content, which takes your readers back to the line containing the footnote's link.

Upvotes: 245

suryasankar
suryasankar

Reputation: 4966

Expanding a little bit on the previous answer, you can make the footnote links clickable here as well. First define the footnote at the bottom like this

<a name="myfootnote1">1</a>: Footnote content goes here

Then reference it at some other place in the document like this

<sup>[1](#myfootnote1)</sup>

Upvotes: 430

Doron Behar
Doron Behar

Reputation: 2879

Although the question is about GitHub flavored Markdown, I think it's worth mentioning that as of 2013, GitHub supports AsciiDoc which has this feature builtin. You only need to rename your file with a .adoc extension and use:

A statement.footnote:[Clarification about this statement.]

A bold statement!footnote:disclaimer[Opinions are my own.]

Another bold statement.footnote:disclaimer[]

Documentation along with the final result is here.

Upvotes: 8

aerijman
aerijman

Reputation: 2762

This works for me:

blablabla [<sup>1</sup>](#1) blablabla

footnotes: reference to blablabla <a class="anchor" id="1"></a>

Upvotes: 14

Devy
Devy

Reputation: 10189

Although I am not aware if it's officially documented anywhere, you can do footer notes in Github.

  1. Mark the place where you want to insert footer link with a number enclosed in square brackets, I.E. [1]

  2. On the bottom of the post, make a reference of the numbered marker and followed by a colon and the link, I.E. [1]: http://www.example.com/link1

And once you preview it, it will be rendered as numbered links in the body of the post.

Upvotes: 15

Chris
Chris

Reputation: 136880

GitHub Flavored Markdown doesn't support footnotes, but you can manually fake it¹ with Unicode characters or superscript tags, e.g. <sup>1</sup>.

¹Of course this isn't ideal, as you are now responsible for maintaining the numbering of your footnotes. It works reasonably well if you only have one or two, though.

Upvotes: 279

Related Questions