I’ve been putting together my own from-scratch theme for my two Hugo-based websites. One of the sites is a writing blog where I plan on posting blog posts, stories, essays, etc.
I am trying to implement a couple of shortcodes for generating footnotes on these essay pages. One takes the footnote content and generates the link to the footnote at the end, the other is placed wherever the notes should appear (i.e. the end of the page) and prints all of the notes.
The problem is that this has a dependency on the order in which the shortcode instances are processed, with the assumption that the first instance is processed first, the second one second, and so on. Instead, with fewer than 8 footnotes I find that they are generated sequentially-ish, but in the order of 5-6-7-1-2-3-4 (or similar but with a different starting number) and not 1-2-3-4-5-6-7. Then only the ones starting at one (in this example, 1 through 4) are put in the footnotes section at the end.
With 8 or more footnotes, everything is just placed randomly. Either way, it isn’t done sequentially.
You can check out my code in the git branch and using this as the content in the markdown file:
I never even knew there was a markdown syntax for footnotes. You learn something new every day, I guess.
I’d still like to use the shortcode if possible though, since I’d prefer a different formatting of the footnotes - namely, making the label a return link rather than “[return]” after each note. Also, the markdown doesn’t support using ^1 for all footnotes and generating the numbers later like with numbered lists.
Also, part of why I posted is that I’m wondering if there is a bug or enhancement possible in Hugo in how the shortcodes are being parsed out of order.
Wouldn’t you want them to match one another? I’m guessing markdown will match [^1] with [^1]:…as far as numbering, you can do this with CSS or JS or a clever combination of the two.
The nice things about using the Markdown syntax are as follows:
You get to use markdown, so when you create the content, it’s cleaner and can live outside of Hugo. (I’m not saying we are going anywhere. I love shortcodes, but if you don’t need them, why not stick with a more universal syntax?)
The syntax that BlackFriday uses is pretty consistent with all other markdown parsers w/r/t rendered HTML, so it works well with other libraries that assume this kind of markup. (E.g., Bigfoot.js)
So that I do not have to keep track of footnotes on the page.
My goal is to have as little JavaScript as possible and avoid CSS workarounds if I can get Hugo to generate the code correctly for me in the first place.
To be honest, I could easily live with the markdown footnote syntax. Part of me posting this was because of the weird parsing behavior/order that I wasn't sure anyone else has seen before.