How do I put a code window like this in a Hugo post?

support
1

image
image1244×708 81.1 KB

  • code should be selectable and copyable
  • I want the surrounding window to look & feel
2

This is mostly a CSS question so outside of the scope of this forum.

Hugo functions that can help you are:

With this render hook you can adjust the markup of code blocks making it easier to style.

Hugo also have support for Chroma syntax highlighting that you might find useful:

3

Thanks a lot, Code block render hooks | Hugo is what I was looking for.

4

That’s how it finally looks like https://www.youtube.com/watch?v=l5PwpHYpBJ4

1 Like
5

That looks pretty neat!

6

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