Syntax highlighting markdown code blocks in Jekyll (without using liquid tags)

Question

It seems like syntax highlighting in Jekyll is limited to using liquid tags and pygments like so:

{% highlight bash %}
cd ~
{% endhighlight %}

But I've imported my existing blog from wordpress and it was written in markdown (using markdown code blocks) and I don't want to have to go through each post and fix the code blocks. Also, I want to keep my posts in pure markdown format in case I ever need to switch blogging platforms again.

I switched my Jekyll parser to redcarpet with the hope that I could use this markdown syntax:

```bash
cd ~
```

But it doesn't seem to work. It just wraps it in a normal code block. Any ideas?

Solution 1

I ended up switching to kramdown to parse markdown which comes with coderay for syntax highlighting. This has the benefit of being a pure ruby solution which works on heroku.

Solution 2

Fenced blocks were introduced with Redcarpet 2. Jekyll now supports Redcarpet 2.

As an aside I am using Redcarpet with Rouge until Kramdown support is available.

In addition some people prefer Nanoc to Jekyll.

Solution 3

Alternate solution

Markdown allows HTML, so if you don't mind adding a bit of JS, you could do this:

## A section

Here is some Ruby code.

<pre>
  <code class="ruby">
    puts "hello"
  </code>
</pre>

Then you could use Highlight.js (documentation here) to add highlighting based on that class.

It's not an ideal solution, but it should work with any Markdown parser.

Solution 4

Step 1. Install Redcarpet.

gem install redcarpet

Step 2. Update the build settings in your _config.yaml like this.

# Build settings
#markdown: kramdown
markdown: redcarpet

Solution 5

Redcarpet is integrated integrated into Jekyll by default and code highlighting will function as expected.

For older Jekyll blogs:

1. Install redcarpet gem:

   gem install redcarpet

2. Update _config.yaml

   markdown: redcarpet
   

For reference and further info see:

Closed Github Issue

Updated Jekyll Codebase

View more solutions

Comments

[cboettig]

Thanks. It seems that kramdown doesn't recognize ```r, even though it does recognize fenced blocks with tildes, ~~~.

[oblitum]

@mirthlab seems to be working very well for math and code, thanks

[Nathan Long]

I've been using Nanoc lately and like it a lot.

[sieste]

link to blog post is broken

[s.k]

Using that, you will recieve an error e-mail from Github; "You are currently using the 'redcarpet' Markdown engine, which is no longer supported by GitHub Pages and may cease working at any time. To ensure your site continues to build, remove the 'markdown' setting in your site's '_config.yml' file and confirm your site renders as expected. For more information, see docs.github.com/github/working-with-github-pages/…."