How can I add a script or shortcode to an individual blog post that appears BELOW the footnotes of the post?

First of all, I’m currently using the hugo-profile theme.

In my blog posts, I’m making use of the footnote markdown feature, where you can type [^1] next to any word in the body, and then add the corresponding [^1]: My footnote text at the end of your post where all references are grouped.

This works great. However, I’m now also trying to add a comment system to some of my blog posts (currently testing Cusdis, but I assume the specific comment system doesn’t matter that much). So at the end of my blog post, I’m adding the comment section with a code snippet like this:

<div id="cusdis_thread" data-host="https://cusdis.com" data-app-id="***"
    data-page-id="{{ .Page.File.UniqueID }}" data-page-url="{{ .Page.Permalink }}" data-page-title="{{ .Page.Title }}"
    data-theme="dark">
</div>
<script defer src="https://cusdis.com/js/widget/lang/es.js"></script>
<script async defer src="https://cusdis.com/js/cusdis.es.js"></script>

However, because I’m writing this in the actual content of my blog post, the comment section actually shows up ABOVE the footnote references, which is obviously not the desired behaviour.

How could I make it so that the comment section is added after the footnote, but ONLY in the specific blog posts I choose?

Alternatively, if that’s too complex, would it be easier to modify the footer so that a comment section is added ONLY to blog posts (but not other kinds of pages)?

You cannot somehow make a shortcode render after footnotes.

Place your comment code in a partial, and call the partial conditionally.

1 Like

Thanks @jmooring!

All I had to do was create a partial for the comment section (in partials/comments.html), then add this to the <article> object in my single.html, right below the {{ .Content | emojify }} line:

<article class="page-content  p-2">
{{ .Content | emojify }}
{{- /* Comments with cusdis.com */ -}}
{{ if and (.Site.Params.CommentsCusdisID) (.Params.comments) }}
{{- partial "comments.html" . -}}
{{end}}
</article>

I added a new comments parameter to the frontmatter of my posts, so whenever it’s set to true the comment section will show up right after the footnotes.

Thanks!

1 Like

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