Showdown Footnotes – 2.1.1
Simply footnotes for Showdown.
Install
I'd advise using this extension with something like browserify.
npm i --save showdown-footnotes
const converter = new showdown.Converter({ extensions: [footnotes] });
Usage
Some word or something that needs explaining[^1].
[^1]: The explanation.
That would look compile to this.
<p>Some word or something that needs explaining<a href="#footnote-1"><sup>[1]</sup></a>.</p>
<p><small class="footnote" id="footnote-1"><a href="#footnote-1"><sup>[1]</sup></a>: The explanation.</small></p>
Single Line Comments
Single line footnotes can be written over multiple lines like this:
[^1]: A single line
footnote
Multi Line Footnotes
Shownotes-footnotes also supports multiline footnotes. You'll just need to indent the lines following the superscript.
[^5]:
This is a paragraph.
_That_ is another paragraph which is still within the same footnote.
Multiline footnotes are wrapped in a <div>
instead of a <small>
.
<div class="footnote" id="footnote-5">
<a href="#footnote-5"><sup>[5]</sup></a>:
<p>This is a paragraph.</p>
<p><em>That</em> is another paragraph which is still within the same footnote.</p>
</div>
Backlinking
WDD's fork supports backlinking! Clicking on a footnote annotation will take you to a footnote's text, as expected, and clicking on the footnote index next to a footnote's text will take you back to the footnote annotation.