Here is a way to highlight your code on Jekyll site using the same Markdown syntax that github supports. I have been using github markdown day-in & day-out mostly with github gists.
To use the same markdown syntax for highlight the code syntax in your Jekyll site. First intall the rouge gem.
gem install rouge
Now in your _config.yml file
markdown: kramdown
highlighter: rouge
kramdown:
input: GFM
The above setting sets kramdown as my markdown and for syntax highlighting use the rouge
the gem you just installed. Also GFM says to use the Github Flavoured Markdown.
Now download the default css for the code styling from Github and copy to the css directory of your site and add the reference in _layout/default.html
.
<link rel="stylesheet" href="/css/syntax.css" type="text/css" />
Done!
Image by Lorenzo Cafaro from Pixabay
Originally shared on Bitsmonkey Blog
Top comments (0)