TOC ne fonctionne pas

support
1

Hello,
I know that this subject has already been discussed at length on this forum but despite all the answers I can’t find a solution.
With my single template the toc is not generated.
Everything works except the toc.

My single template:

{{ define "main" }}
<div class="row justify-content-center gx-0">
    <!-- Menu de l'article -->
    <div class="col-lg-2 d-none d-lg-block">
        <div class="card shadow-sm sticky-top" style="top: 100px;">
            <div class="card-body">
                <h5 class="card-title">Sommaire</h5>
                {{ .TableOfContents }}
            </div>
        </div>
    </div>

    <!-- Contenu de l'article -->
    <div class="col-lg-6">
        <div class="px-4 text-center">
            <i class="fa-solid fa-{{ .Params.icon }}"></i>
            <h1 class="display-4 mb-2 fw-bold text-body-emphasis">{{ .Title }}</h1>
            <div class="my-4 d-flex justify-content-evenly">
                <div>
                    <i class="fa-regular fa-clock"></i> {{ .Date.Format "02 janvier 2006" }} &#x2022; {{ .Date.Format
                    "15:04" }}
                </div>
                <div>
                    <img src="https://app.ugosign.com/images/hugo.jpg" alt="Photo de Hugo LEROUX" class="rounded-circle"
                        style="width: 30px; height: 30px;">
                    <span class="ms-1">{{ .Params.Author }}</span>
                </div>
                <div>
                    <i class="fa-regular fa-folder-closed"></i>
                    {{ range .Params.categories }}
                    <a href="{{ " /categories/" | relLangURL }}{{ . | urlize }}">{{ . }}</a>
                    {{ end }}
                </div>
            </div>
            <h4 class="mb-4">{{ .Params.Intro }}</h4>
            {{ if .Params.Image }}
            <div class="container px-5">
                <img src="/images/blog/{{ .Params.Image }}" class="img-fluid border rounded-3 mb-4" alt="Example image"
                    loading="lazy">
            </div>
            {{ end }}
        </div>
        <div class="container mt-3">
            {{ .Content }}
            {{ $taxonomy := "tags" }}
            {{ with .Param $taxonomy }}
            {{ range $index, $tag := . }}
            {{ with $.Site.GetPage (printf "/%s/%s" $taxonomy $tag) -}}
            <a href="{{ .Permalink }}" class="btn btn-outline-primary">
                <i class="fa-solid fa-hashtag fa-fw ms-2"></i>
                {{ $tag | urlize }}
            </a>
            {{- end -}}
            {{- end -}}
            {{ end }}
        </div>
    </div>
</div>
{{ end }}

My post:

---
title: "Les 6 fonctionnalités clés de la signature électronique pour les coachs d'entreprise"
intro: "Découvrez comment la signature électronique aide les coachs en entreprise à accélérer leur activité."
summary: "Découvrez comment la signature électronique aide les coachs en entreprise à accélérer leur activité."
description: "Les 6 fonctionnalités clés utile pour les coachs d'entreprise offertes par Ugosign"
date: 2024-10-02T10:32:45+01:00
draft: false
author: "Hugo LEROUX"
image: "6-fonctionnalites-coach-entreprise.webp"
altImage: "6 features pour les coachs en entreprise - Ugosign"
toc: true
categories:
- Signature électronique
tags:
- Business
---
<p>...</p>
<h2>1. Title A</h2>
<p>...</p>
<h2>2. Title B</h2>
<p>...</p>
<h2>3. Title C</h2>
<h2>Conclusion</h2>
<p>...</p>

Version:

hugo v0.136.5-46cccb021bc6425455f4eec093f5cc4a32f1d12c+extended linux/amd64 BuildDate=2024-10-24T12:26:27Z VendorInfo=gohugoio

Thanks

2

https://gohugo.io/methods/page/tableofcontents/

The TableOfContents method on a Page object returns an ordered or unordered list of the Markdown ATX and setext headings within the page content.

Or to put it another way, it doesn’t work with HTML content.

3

I wrote a template library to generate the correct and intuitive table of contents (ToC).
https://github.com/jerrychan7/hugoPerfectToC

Every h1~h6 with an id attribute will be treated as a heading to be put into the ToC.

The downside is that parsing is time-consuming, and I am trying to optimize it.

4

Or just use tocbot.js.