I have written a shortcode for citations, heavily inspired by the work of Nelis Oostens, which works the way I wanted. In fact it goes slightly further in the sense that it automatically formats the source of the quotation using MLA citation format. (An example of the shortcode in use can be seen on the test article on my staging site.)
1. Shortcode [edited]
{{ printf "<figure class=\"quotation\">" | htmlUnescape | safeHTML }}
{{- $split := split .Inner "<-source->" -}}
{{ printf "<blockquote>" | htmlUnescape | safeHTML }}
{{ printf "<p>" | htmlUnescape | safeHTML }}
{{ index $split 0 | safeHTML }}
{{ printf "</p>" | htmlUnescape | safeHTML }}
{{ printf "</blockquote>" | htmlUnescape | safeHTML }}
{{ printf "<figcaption class=\"source\">" | htmlUnescape | safeHTML }}
{{ index $split 1 | safeHTML }}{{ if .Get "main-title" }}. {{ if .Get "secondary-title" }}{{ printf "<q>" | htmlUnescape | safeHTML }}{{ .Get "secondary-title" | htmlUnescape | safeHTML }}{{ printf ".</q> " | htmlUnescape | safeHTML }}{{ end }}{{ printf "<cite>" | htmlUnescape | safeHTML }}{{ if .Get "url" }}[{{ .Get "main-title" }}]({{ .Get "url" }}){{ else }}{{ .Get "main-title" }}{{ end }}{{ printf "</cite>" | htmlUnescape | safeHTML }}{{ end }}{{ if .Get "publisher" }}. {{ .Get "publisher" | htmlUnescape | safeHTML }}{{ end }}{{ if .Get "date" }}, {{ .Get "date" | htmlUnescape | safeHTML }}{{ end }}{{ if .Get "pages" }} ({{ .Get "pages" | htmlUnescape | safeHTML }}){{ end }}.
{{ printf "</figcaption>" | htmlUnescape | safeHTML }}
{{ printf "</figure>" | htmlUnescape | safeHTML }}
2. References in post content
{{% quotation main-title="Moralia" url="<https://en.wikipedia.org/wiki/Moralia>](https://en.wikipedia.org/wiki/Moralia)" secondary-title="On Moral Virtue" date="c. 100 AD" publisher="Loeb" page="71" %}}
But for the sake of some little mouthful of flesh we deprive a soul of the sun and light, and of that proportion of life and time it had been born into the world to enjoy.
<-source->
Plutarch[^1]
{{% /quotation %}}
[^1]: Cited in Franklin, Julian H., {{% cite %}}Animal rights and moral philosophy{{% /cite %}}. New York: Columbia University Press, 2005, p. 6.
3. SCSS
.source {
padding: 0 0 5%;
margin: 0;
text-align: right;
}
What I haven’t been able to do are two things:
1. Add an emdash (—) at the beginning of the <figcaption> element
In my previous WordPress site, I used the .source class to add this automatically, like this:
.source {
padding: 1% 0 5%;
text-align: right;
&::before {
content: '\2014\2009';
}
&::after {
content: '.'
}
}
Unfortunately in Hugo the pseudo-elements in the .source class break the code and prevent the Markdown from rendering as html. Any suggestions as to how this can be rendered would be welcome.
2. Render the parameter for page numbers differently when a range of pages is entered
At present, using MLA conventions, I’m wrapping the parameter for page numbers in parentheses. In practice though in the context of a blog, I don’t think this is ideal and would prefer to display the pages parameter differently depending on whether a single page (‘p. 71’), a continuous range of pages (‘pp 71-75’) or a discontinuous list of pages (‘pp 71, 76, 80’). Is there any way this can be done?
