Manual syntax highlighting in code blocks?

Is there a way to manually highlight parts of a plaintext code block with Hugo?

What I’d like is something similar to the escape lexer in Jekyll/rougify, where I can do:

```escape
https://app.target.com/users?id=<!123456!>
`​``

It will be rendered like a plaintext code block, except 123456 (the text between <! and !>) will be highlighted in red:

We use Chroma to perform syntax highlighting. I suggest you create a proposal to add a new lexer, referencing:

https://github.com/rouge-ruby/rouge/blob/master/lib/rouge/lexers/escape.rb

2 Likes

Thanks for your suggestion. In the meantime, I’ve created a custom shortcode in layouts/shortcodes/hl.html:

<span class="{{ index .Params 0 | default "k" }}">{{ .Inner }}</span>

which I can use as follows:

```plaintext
Some text with a {{<hl>}}Keyword{{</hl>}} and a {{<hl s>}}LiteralString{{</hl>}}.
```