Heading render hooks

Context

Heading render hook templates receive the following context:

Anchor

(string) The id attribute of the heading element.

Attributes

(map) The Markdown attributes, available if you configure your site as follows:

markup:
  goldmark:
    parser:
      attribute:
        title: true

[markup]
  [markup.goldmark]
    [markup.goldmark.parser]
      [markup.goldmark.parser.attribute]
        title = true

{
   "markup": {
      "goldmark": {
         "parser": {
            "attribute": {
               "title": true
            }
         }
      }
   }
}

Level

(int) The heading level, 1 through 6.

Page

(page) A reference to the page containing the heading.

PlainText

(string) The heading text as plain text.

Text

(string) The heading text.

Examples

In its default configuration, Hugo renders Markdown headings according to the CommonMark specification with the addition of automatic id attributes. To create a render hook that does the same thing:

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

To add an anchor link to the right of each heading:

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