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:

<!-- your HTML here.. -->

Wait for it..

Mind blown

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!