Problem: TOC and link path

support
1

Hello,

I have the following problem: The Table of Content is created correctly in a blog article, but the link path looks like this:

localhost:1313/#example-header

By clicking on the TOC link, the article is left and the home page is called up. The creation of the TOC is generated by a shortcode. The shortcode just consists of the following code: {{.Page.TableOfContents}}

The project is multilingual. The entire link works fine, but the TOC link does not include the article name in the link. Can someone give me a hint - what am I doing wrong?

hugo v0.82.0 + extended darwin / amd64

2

Do you have a heading render hook (layouts/_default/_markup/render-heading.html)?
What does your site configuration look like?

It would be really helpful if you could share a link to the public repository for your project.

3

Thank you for your reply.

Do you have a heading render hook (layouts/_default/_markup/render-heading.html)?

Yes, I used the example Configure markup | Hugo.

What does your site configuration look like?

baseURL = "https://tekki-tipps.de/"
languageCode = "de-DE"
title = "tekki-tipps.de"
theme = "tekki"
enableRobotsTXT = "true"
relativeURLs = "true"
DefaultContentLanguage = "de"

[languages]
  [languages.de]
    languageName = "Deutsch"
    weight = 1
    description = "in deutsch"
    [[languages.de.menu.main]]
      url    = "/leer/"
      name   = "Tags"
      weight = 1
    [[languages.de.menu.main]]
      url    = "/datenschutz/"
      name   = "Datenschutz"
      weight = 10
    [[languages.de.menu.main]]
      url    = "/impressum/"
      name   = "Impressum"
      weight = 20
  [languages.en]
    languageName = "English"
    weight = 2
    description = "in english"

    [[languages.en.menu.main]]
      url    = "/leer/"
      name   = "Tags"
      weight = 1
    [[languages.en.menu.main]]
      url    = "/data-protection/"
      name   = "Data Protection"
      weight = 10
    [[languages.en.menu.main]]
      url    = "/imprint/"
      name   = "Imprint"
      weight = 20

[params]
  homeTitle = "Hugo, Webdesign, CSS/SCSS, SEO, Tools"

[taxonomies]
  tag = "tags"

[markup]
  [markup.goldmark]
    [markup.goldmark.renderer]
      unsafe = true
  [markup.highlight]
    noClasses = false
  [markup.tableOfContents]
    endLevel = 3
    ordered = false
    startLevel = 2

[permalinks]
  blog = "/:slug/"

If I want help, I have to provide the basis for it. But I don’t want to make my entire source publicly available. I have no problem sending you my source personally. Would that be a possibility?

4

The heading render hook example in the documentation does not produce anything special. It simply demonstrates how to customize a heading.

Please disable the heading render hook by renaming:

layouts/_default/_markup/render-heading.html

To:

layouts/_default/_markup/xxx-render-heading.html

Then test again. That will remove one variable from the equation.

Yes, please do.

5

Thank you for sharing your repository (privately). That made troubleshooting much easier.

The TOC items are generated correctly. For example:

<li><a href="#svg-icon-per-font-schnell-einbinden">SVG-Icon per Font schnell einbinden</a></li>

The problem is in themes/tekki/layouts/partials/head.html.

<base href="{{ .Site.BaseURL }}">

This is causing the browser to go to:

http://localhost:1313/#svg-icon-per-font-schnell-einbinden

Remove that line from your template.

Other comments:

  1. Do not quote boolean (true/false) values when writing TOML. For example, in your config.toml file do this:

    enableRobotsTXT = true

    Not this:

    enableRobotsTXT = "true"

  2. Your heading render hook is incorrect.

    <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }} <a href="#{{ .Anchor | safeURL }}">mm¶</a></h{{ .Level }}>

    I know that you started with the example in the documentation; it is wrong. I will fix the documentation. Unless you need to alter the heading, delete the render hook file. If you do need to alter the heading, use this as a starting point:

    <h{{ .Level }} id="{{ .Anchor | safeURL }}">{{ .Text | safeHTML }}</h{{ .Level }}>

    There’s no need to include an <a> element. See https://stackoverflow.com/a/484781.

6

Wow, thank you very much for your private commitment. That helps me alot.

7

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