UNPKG

2.86 kBMarkdownView Raw
1# markdown-it-footnote
2
3[![Build Status](https://img.shields.io/travis/markdown-it/markdown-it-footnote/master.svg?style=flat)](https://travis-ci.org/markdown-it/markdown-it-footnote)
4[![NPM version](https://img.shields.io/npm/v/markdown-it-footnote.svg?style=flat)](https://www.npmjs.org/package/markdown-it-footnote)
5[![Coverage Status](https://img.shields.io/coveralls/markdown-it/markdown-it-footnote/master.svg?style=flat)](https://coveralls.io/r/markdown-it/markdown-it-footnote?branch=master)
6
7> Footnotes plugin for [markdown-it](https://github.com/markdown-it/markdown-it) markdown parser.
8
9__v2.+ requires `markdown-it` v5.+, see changelog.__
10
11Markup is based on [pandoc](http://johnmacfarlane.net/pandoc/README.html#footnotes) definition.
12
13__Normal footnote__:
14
15```
16Here is a footnote reference,[^1] and another.[^longnote]
17
18[^1]: Here is the footnote.
19
20[^longnote]: Here's one with multiple blocks.
21
22 Subsequent paragraphs are indented to show that they
23belong to the previous footnote.
24```
25
26html:
27
28```html
29<p>Here is a footnote reference,<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup> and another.<sup class="footnote-ref"><a href="#fn2" id="fnref2">[2]</a></sup></p>
30<p>This paragraph won’t be part of the note, because it
31isn’t indented.</p>
32<hr class="footnotes-sep">
33<section class="footnotes">
34<ol class="footnotes-list">
35<li id="fn1" class="footnote-item"><p>Here is the footnote. <a href="#fnref1" class="footnote-backref">↩</a></p>
36</li>
37<li id="fn2" class="footnote-item"><p>Here’s one with multiple blocks.</p>
38<p>Subsequent paragraphs are indented to show that they
39belong to the previous footnote. <a href="#fnref2" class="footnote-backref">↩</a></p>
40</li>
41</ol>
42</section>
43```
44
45__Inline footnote__:
46
47```
48Here is an inline note.^[Inlines notes are easier to write, since
49you don't have to pick an identifier and move down to type the
50note.]
51```
52
53html:
54
55```html
56<p>Here is an inline note.<sup class="footnote-ref"><a href="#fn1" id="fnref1">[1]</a></sup></p>
57<hr class="footnotes-sep">
58<section class="footnotes">
59<ol class="footnotes-list">
60<li id="fn1" class="footnote-item"><p>Inlines notes are easier to write, since
61you don’t have to pick an identifier and move down to type the
62note. <a href="#fnref1" class="footnote-backref">↩</a></p>
63</li>
64</ol>
65</section>
66```
67
68
69## Install
70
71node.js, browser:
72
73```bash
74npm install markdown-it-footnote --save
75bower install markdown-it-footnote --save
76```
77
78## Use
79
80```js
81var md = require('markdown-it')()
82 .use(require('markdown-it-footnote'));
83
84md.render(/*...*/) // See examples above
85```
86
87_Differences in browser._ If you load script directly into the page, without
88package system, module will add itself globally as `window.markdownitFootnote`.
89
90
91## License
92
93[MIT](https://github.com/markdown-it/markdown-it-footnote/blob/master/LICENSE)