When I am creating footnotes in the editor on my site, they show up like this in the preview:
but like this
in the post. Is this… on purpose? Is it configurable behavior?
It would also be nice to have the ability to opt for numbered footnotes, in different styles, like [1] or 1 or ①, or even the traditional sequence *, †, ‡, §, ‖, ¶, or commonly used * ** *** ****.
Ah, thanks. I totally missed that even though it’s right there .
What I really want, though, is the numbered behavior but inline expansion, and possibly with an expandable “footnotes” thing at the bottom.
That would be great. I find the ellipsis button … disrupts the text quite a bit and would much prefer a superscript. In the editor preview pane, the numbered footnote appears at the bottom and the two labels (inline and footnote in the footer) appear to be hyperlinks to each other–but that could just be the label() reference in the program code. The “footnote at bottom” (which should be a case of speaking redundantly but isn’t because we’ve mixed Inline Note and Footnote with this function) even uses a return character ‘↩︎’ as the link anchor.
I don’t have a Discourse installation to test settings with, but I hope that turning off display_footnotes_inline produces the standard APA footnote.
The inline note has a place and there’s no consensus at dscuss.python.org about which is preferred between inline and footnote. I like them both and would like to havebut the inline notes leave a but to be desired. Here’s a list I put together during the discussion:
PRO: convenient; click it to show.
CON: you can’t simply click again to hide. A mouse move before click is needed (happily, software is highly mutable).
FOOTNOTE: The footnote as rendered in the message/post editor preview pane has hyperlinks that look like could be used to jump quickly and conveniently to the note and back up to the body. The note itself even uses a “return” character for the hyperlink.
PRO: convenient; read the note in situ and move on.
CON: visually obstructive in its current implementation.
The ellipsis button graphic contrasts significantly with the surrounding text and is not aesthetic (happily, software is highly mutable–you see the theme). The ellipsis could be much smaller and still serve its purpose.
FOOTNOTE: The footnote superscript is subtle, especially with the low-contrast hyperlink text in the Dark Theme.
PRO: good for short supplemental notes.
CON: long passages overlay the text and disturb the reader’s orientation within the paragraph. It can be jarring, visually.
FOOTNOTE: Because footnotes are effectively an appendix, they can be long without disturbing the reader’s “flow” through the body.
FOOTNOTE: The footnote presented on a clean/clear background with margins all around is a smoother (less noisy) presentation than the popup note overlaid on the message/post body text.
Bit of late at the party, but in order to display the numbers instead of the elipsis (while you’re still showing the note in a tooltip), you can rely on a little CSS snippet:
.cooked.inline-footnotes {
counter-reset: foot-note;
}
.inline-footnotes a.expand-footnote {
text-decoration: none !important;
font-size: 0.77em;
vertical-align: super;
min-height: unset;
border: 1px solid var(--primary-medium);
padding: 0 0.4em;
vertical-align: super;
}
.inline-footnotes a.expand-footnote:before {
counter-increment: foot-note;
content: counter(foot-note);
}
.inline-footnotes a.expand-footnote svg {
display: none;
}
/* everything below is some extra customization */
#footnote-tooltip {
border: 1px solid var(--primary-medium);
}
#footnote-tooltip #arrow:before {
border-top: 1px solid var(--primary-medium);
border-left: 1px solid var(--primary-medium);
}
#footnote-tooltip[data-popper-placement^=bottom]>#arrow {
top: -6px !important;
}
The result looks like this:
Awesome work. I deployed it on my forum and it works amazing!
