Use footnote multiple times in HTML Quarto

Question

I would like to use a single footnote multiple times in HTML Quarto. The problem is that once I create a footnote and use it twice, it will be shown as two footnotes. Here is a reproducible example:

---
title: "Footnote multiple times"
editor: visual
format: html
---

Some example text for a footnote[^1].

Some example text for same footnote[^1].

[^1]: Example footnote.

Output:

As you can see, the footnote is shown as two separate footnotes (duplicated) while I created one footnote. So I was wondering if anyone knows how to create one footnote and use it multiple times in HTML Quarto?

If you had one footnote at the bottom of the page, is it possible to refer back to different places when clicking on the footnote back sign?! what do you think?" — shafee, Dec 01 '22 at 01:25
I am saying that it may be partially possible (that is, you can create multiple references to same footnote) but I am asking how would you refer back to texts in multiple places using one link ? — shafee, Dec 01 '22 at 07:18
And this behavior seems expected because that's how pandoc works (see this [old issue](https://github.com/jgm/pandoc/issues/1603) which dates back to 2014) and quarto depends on pandoc. So I think the possible solution at the moment is implementing footnotes using raw html code. — shafee, Dec 01 '22 at 07:41
@shafee, Thank you for the clarification. Are you able to create a HTML answer if Pandoc is not an option? — Quinten, Dec 01 '22 at 07:55

shafee · Accepted Answer · 2022-12-01T08:12:35.920

We can sort of mimic how quarto would have generated the html code creating for footnotes to get similar appearances (that's why I have used r function so that I don't have to write the same thing multiple times).

---
title: "Footnote multiple times"
format: html
---

```{r}
#| echo: false

gen_fn <- function(n, id) {
  # n is number of footnote
  # id is a unique id for that footnote
  paste0('<a href="#',id, '" class="footnote-ref" role="doc-noteref" aria-expanded="false"><sup>', n, '</sup></a>')
}
```

Some example text for a footnote`r gen_fn(1, "fn1")`

Some example text for same footnote`r gen_fn(1, "fn1")`

Another text containing different footnotes`r gen_fn(2, "fn2")`

```{=html}
<footer>
  <h2>Footnotes</h2>
  <ol  style="padding-left: 1rem;">
    <li id="fn1"><p>Example footnote.</p></li>
    <li id="fn2"><p>More footnote.</p></li>
  </ol>
</footer>
```

Use footnote multiple times in HTML Quarto

1 Answers1