Footnotes appear on a new paragraph?

Using Themes
1

Hi,

I’m relatively new to Hugo/CSS and have been trying to set-up a new website for academic purposes. However the footnotes towards the end of the page appear in a very weird way:

image
image558×556 7.33 KB

I’ve already searched inside this forum and elsewhere and can’t find anything useful. I’ve searched for any place inside the theme (called itheme) which would customize footnotes and there’s almost nothing.

If I look at the source code for the footer it looks like this:

<li id="fn:1">
<p class="component-content component">footnote text&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
<li id="fn:2">
<p class="component-content component">footnote text&#160;<a href="#fnref:2" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol></div>

So apparently footnotes appear inside their own paragraph(?). Is this a bug?

I’ve tried fixing this with CSS but I’m out of solutions for now.

Thanks.

2

No.

Please raise an issue with the theme author:
https://github.com/floyd-li/hugo-theme-itheme/issues

1 Like
3

Here is where they customize footnotes: in single.html

<div class=“pagebody”>
<!-- TODO: hugo render hooks do not support custom markdown so here replace element manually →
{{ $content := .Content | replaceRE “<p>” “<p class="component-content component">” }}

I dunno why, but it’s the theme’s doing.
to not disrupt it I would just add

.footnotes {
    p.component-content.component { display:inline}}
1 Like
4

Right, thank you @jmooring!

5

Thank you @Tom_Durand, will look into that!

6

I had to modify slightly the syntax but this indeed seems to work:

.footnotes p.component-content.component {
	display:inline;
}

Thank you!

7

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.