The underdocumented easy way to highlight code in Jekyll
In this post, I will quickly share an “Aha!” moment with you.
I used to wrap my code in {% highlight %} and {% endhighlight %} tags like it’s explained in the documentation. But with more than a single code block on a page, this gets annoying quickly.
Turns out there is an easier way built into Jekyll.
The easy way
It wasn’t until I read this post by Frank Lin mentioning a different way to achieve the same result. It goes like this:
```html
<!-- your HTML here.. -->
```Wait for it..

Why isn’t this mentioned in the Jekyll documentation?!
From the article I learned this syntax is called fenced_code_blocks. Turns out this is documented, but swept under the Redcarpet Markdown Options.
Enjoy highlighting your code the easy way!
Sources
- All sources are referenced inline.
- Image courtesy: Jekyll and Font Awesome