Blog Setup (part 5) : Add syntax highlighting

 

[!WARNING]

For my blog, I am no longer using the anatole theme showed in this post and series. I made a Tailwind CSS theme. Read about it in Hugo Theme Development Series

Introduction

Syntax highlighting makes code easier to read and follow.

 

Enable Chroma

Hugo has built in support for syntax highlighting using Chroma. Anatole theme already has monokai and monokailight sytles for syntax highlighting which removes the need to run hugo gen chromastyles.
To enable the Chroma, add in project config.toml

pygmentsCodeFences = true
pygmentsUseClasses = true

NOTE: There are separate chroma language codes for go, go-html-template and go-text-template