HUGO

Replace 'TableOfContents' id in rendered TOC?

I cannot seem to be able to remove the TableOfContents id from the Hugo rendered TOC. What makes this odd, is that I know well how replace and replaceRE work. But the output is not what I expect.

For example:

{{ replace .Page.TableOfContents "TableOfContents" "toc"}}

Still renders:

<nav id="TableOfContents"> <ul> <li><a href="[#introduction-to-bash](view-source:http://localhost:1313/bash-example-csharp/#introduction-to-bash)">Introduction to bash</a> <ul> ...

replaceRE also fails, even though an online regex tester says it’s right:

{{ replaceRE "TableOfContents" "toc" .Page.TableOfContents }}
<nav id="TableOfContents"> <ul> <li><a href="[#introduction-to-bash](view-source:http://localhost:1313/bash-example-csharp/#introduction-to-bash)">Introduction to bash</a> <ul> <li>

Which confuses me even more, is that this reported solution neither works anymore:

{{ replace .Page.TableOfContents "nav id=\"TableOfContents\"" "div class=\"toc\"" | safeHTML }}
<nav id="TableOfContents"> <ul> <li><a href="[#introduction-to-bash](view-source:http://localhost:1313/bash-example-csharp/#introduction-to-bash)">Introduction to bash</a> <ul> <li>

What am I missing or overlooking here? :thinking:

Thanks for any input!


Hugo Static Site Generator v0.67.0/extended windows/amd64 BuildDate: unknown
GOOS="windows"
GOARCH="amd64"
GOVERSION="go1.14

Tried both examples and everything works for me. :thinking:

Hugo Static Site Generator v0.69.0-DEV-CFA73050/extended linux/amd64 BuildDate: 2020-03-24T10:45:24+0700
1 Like

Thanks for checking it on your end! :+1:

I couldn’t replicate it, even updated to 0.68.3 (I don’t know how to build the same version you got so I’m not on the same version yet).

But I did make some progress! Because I don’t get the problem on regular pages, only in shortcodes.

So this works for me:

{{ replace .TableOfContents "TableOfContents" "toc" | safeHTML }}
<nav id="toc"> <ul> <li><a href="[#introduction-to-bash](view-source:http://localhost:1313/bash-example-csharp/#introduction-to-bash)">Introduction to bash</a> <ul>

But the same code in a shortcode fails:

{{ replace .Page.TableOfContents "TableOfContents" "toc" | safeHTML }}
<nav id="TableOfContents"> <ul> <li><a href="[#introduction-to-bash](view-source:http://localhost:1313/bash-example-csharp/#introduction-to-bash)">Introduction to bash</a> <ul> <li>

Pamubay, do you remember if you tested the code in shortcode or in a regular page template? :slightly_smiling_face:

Thanks for any insights!


For completeness, I call my shortcode with {{<toc>}}. So it’s a shortcode with content that doesn’t need further rendering, as the docs suggest.

(If I change the shortcode call to {{%toc%}} the issue still happens.)


Hugo Static Site Generator v0.68.3/extended windows/amd64 BuildDate: unknown
GOOS="windows"
GOARCH="amd64"
GOVERSION="go1.14.1"

Yes, You are right, it doesnt work inside shortcode template :open_mouth:
i also trying combine print printf and string funcs, but nothing works.

1 Like

Thanks for the confirmation Pamubay! :slightly_smiling_face:

I’ve researched the issue further and made an issue report here.