Hugo + Pygments—How to change highlighting theme?

Question

Using Pygments with Hugo, I can do syntax highlighting with blocks like this:

```ruby
def hello object
  puts "Hello, #{object}"
end
```

This "works" in that the code is colored, but the colors aren't good, with white text (from Pygments) on white background (from Hugo theme). Is there a way to change the theme of the highlighting?

Answer 1

In /config.toml you need these lines:

PygmentsCodeFences = true
PygmentsStyle = "monokai"

For a list of styles, https://help.farbox.com/pygments.html is a good source. I think there are more, but I haven't found a comprehensive list yet.

For the background of code blocks, actually this is set by the Hugo theme, for the Hyde theme I was using I needed to override the css like this:

/themes/hyde/static/css/override.css

pre {
  background-color: #23241f;
}
code {
  background-color: #EEE
}

And add the ref link to /themes/hyde/layouts/partials/head.html

<link rel="stylesheet" href="{{ .Site.BaseURL }}css/override.css">