Custom footnote shortcode

tips & tricks
1

Hey everybody, I’ve been writing a few blog posts on my personal blog lately that have required me to link to references and I found the existing markdown syntax for footnotes a bit wanting so I rolled my own.

Here’s the footnote.html code

{{- $footnotes := .Page.Store.Get "footnotes" -}}
{{/*{{ Initialize the footnotes array }}*/}}
{{- if eq $footnotes nil -}}
  {{- $footnotes = slice -}}
  {{- .Page.Store.Set "footnotes" $footnotes -}}
{{ end }}

{{/*{{ Get parameters }}*/}}
{{- $link := .Get "link" -}}
{{- $citation := .Get "citation" -}}
{{- $ctitle := .Get "title" -}}
{{- $authors := .Get "authors" -}}
{{- $year := .Get "year" -}}

{{/*{{ Create array Entry }}*/}}
{{- $entry :=  (dict "link" $link "title" $ctitle "authors" $authors "year" $year) -}}

{{- $footnotes = $footnotes | append $entry -}}
{{- .Page.Store.Set "footnotes" ($footnotes | uniq) -}}

{{- $currentFootNote := $footnotes | len -}}

{{/*{{Create superscript that scrolls down to appropriate reference when clicked}}*/}}
{{- .InnerDeindent -}}<sup>
  {{- $idref := (string $currentFootNote) | add "#footnote_entry_"  | add .Page.RelPermalink | relURL -}}
  {{ warnidf "HUGO-FOOTNOTE-SC" "idref: %v" $idref }}
  <a href="{{ $idref }}">
    {{- string $currentFootNote -}}
  </a></sup>

And here is the footnote-references.html code

{{- $entries := .Page.Store.Get "footnotes" -}}
{{- $heading := .Get "heading" | default "References" -}}

{{ warnidf "HUGO-FOOTNOTE-REFERENCES-SC" "entries %v" $entries }}

<h2>{{- $heading -}}</h2>
<ol>
{{ range $_footnote, $entry := $entries }}
  {{- $footnote := add $_footnote 1 -}}
  {{- $link := index $entry "link" -}}
  {{- $ctitle := index $entry "title" -}}
  {{- $authors := index $entry "authors" -}}
  {{- $year := index $entry "year" -}}
  {{- warnidf "HUGO-FOOTNOTE-REFERENCES-SC" "entry %v" $entry -}}

  <li id={{- add "footnote_entry_" (string $footnote) -}}>
    <a href={{- $link -}}>
      <em>{{- $ctitle -}}</em>
    </a>({{- $authors -}}
    {{- if ne $year nil -}}
      , {{ $year }} 
    {{ end }}
    )
  </li>
{{ end }}
</ol>

Example usage:

According to {{<footnote title="Idling is a virtue" authors="Foo,Bar,Baz" year="2001" link="https://example.com"> }} a 2001 study {{</footnote>}}, wasting time is actually good for you, which corroborates the findings of a {{<footnote title="No really, idling is amazing" authors="Zab, Rab, Oof" year="2005" link="https://example.com" >}} later study by a totally different team. {{</footnote>}}

{{<footnote_references heading="References">}}

Which renders to:

According to a 2001 study 1 , wasting time is actually good for you, which corroborates the findings of a later study by a totally different team. 2

References

  1. Idling is a virtue (Foo,Bar,Baz, 2001 )

  2. No really, idling is amazing (Zab, Rab, Oof, 2005 )

(Note that, since I’m a new user, I had to remove the links in the rendered output, but each list entry would link to the url provided in the link parameter of the footnote shortcode tag. Additionally the supercript labels would link to its corresponding entry in the reference list)

I recognize it’s a little clunky, but it works for my use-case using neovim snippets to fill out the fields so thought I’d share.

1 Like
2

That’s cool! Kind of like an inline Bibtex thing. If you’re looking for integration with Zotero etc., there’s Hugo Academic that might work for your citation needs.

3

Yeah that’s the idea. I was trying to make a quick and dirty solution for some simple blog posts, but still wanted to make sure I was able to cite papers and other resources easily.

I’ll give academic a try for sure though. Looks like a really great tool to simplify the workflow, especially for longer, more research-heavy posts/articles.

4

I think Academic is anything by a tool to simplify, but you might be able to crib the bits that deal with Bibtex…