Override default highlight setting per page in front matter

support
1

I have some site wide defaults for markup / highlighting (with Chroma), like lineNos: false.
However on some pages I would like to set on lineNos: true by default, without having to repeat it for every code block.

It doesn’t seem like it can be set in the front matter, e.g.

---
...
markup:
  highlight:
    lineNos: true
---

does not work, which is about expected as this is not listed as a key that could be overriden.
Setting this in the main hugo.yaml file works of course, but not in the front matter.

Is there any solution for this?

2

To make sure I understand the requirement, are you trying to control this by page, or by code language?

3

I want to control this by page

4

Use a code block render hook.

layouts/_default/_markup/render-codeblock.html

{{ $opts := .Options }}
{{ with .Page.Params.markup.highlight }}
  {{ $opts = merge . $opts}}
{{ end }}
{{ $result := transform.HighlightCodeBlock . $opts }}
{{ $result.Wrapped }}

Also see https://gohugo.io/functions/transform/highlightcodeblock/.

Front matter…

+++
title = 'Post 1'
date = 2023-01-01T00:00:00-00:00
draft = false
[params.markup.highlight]
linenos = true
style = 'friendly'
+++

With the render hook above, precedence is:

  1. The info string for the fenced code block
  2. Page params
  3. Site params
2 Likes
5

I just updated the above to use params.markup.highlight to be consistent with the site config structure.

1 Like
6

Thanks a lot, that works perfectly!

I didn’t think of render hooks. I read about them in the docs, but I just began learning Hugo this week :slight_smile:

7

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