Highlight with Jekyll and pygments doesn't work

Question

I have the following code:

{% highlight java %}
NullPointerException at org.springframework.core.GenericTypeResolver.getTypeVariableMap
{% endhighlight %}

When I generate my site with jekyll --pygments, the html result is:

<div>
  <pre><code class="java">NullPointerException at org.springframework.core.GenericTypeResolver.getTypeVariableMap</code>
  </pre>
</div>

In this html output there aren't the expected <span class="n"> or <span class="s2"> tags, and the code is not highlighted.

Am I doing something wrong?

May be a silly question, but rather than testing with an exception message, what happens if you try some actual java code? — Kev, Jul 20 '11 at 12:40
yes, I tried with java code and also ruby code and got the same behaviour — denisjacquemin, Jul 20 '11 at 13:43
I guess, the 'sudo easy_install Pygments' worked fine, how to be sure it's installed properly? — denisjacquemin, Jul 22 '11 at 11:07

score 38 · Accepted Answer · answered Mar 20 '12 at 00:12

38

You need to have the css generated to highlight.

$ pygmentize -S default -f html > css/pygments/default.css

answered Mar 20 '12 at 00:12

wnascimento

1,949
1
19
16

20

+10 - this should really be more prominent (existing?) in the Jekyll docs – Peter Ajtai Oct 21 '12 at 03:56
5

Note that you'll also have to tell your Jekyll template(s) to pick up the new CSS file -- in my case, by editing _layouts/default.html (Jekyll bootstrap). – JohnJ Nov 06 '12 at 01:45
5

I just added some notes to the [jekyll install wiki](https://github.com/mojombo/jekyll/wiki/Install) about how to actually use Pygments after you have it installed. Hopefully, it'll clear things up. – Alan W. Smith Feb 02 '13 at 23:09
In case it's not obvious, you must first install pygment: `pip install Pygment`. – bcorso Jul 08 '15 at 06:57
`$ pip install Pygment` `Collecting Pygment` `Could not find a version that satisfies the requirement Pygment (from versions: )` `No matching distribution found for Pygment` – jimjamslam Feb 01 '16 at 23:33

score 2 · Answer 2 · edited May 23 '17 at 12:01

An alternative to installing pygments separately and generating the CSS, one can directly pull the CSS from the Jekyllrb documentation here

The direct link extracted from the documentation I mentioned above is here: https://github.com/mojombo/tpw/blob/master/css/syntax.css

(It's the authors official version on GitHub)

The file is called syntax.css, drop it into your css folder, and create a relative link to the stylesheet in the header of any/all files to enable syntax highlighting.

This can be done as such for example, I placed it in head.html or css.html where I have all the relative links, it's in the _include folder so it gets included in all layouts that uses it:

<link rel="stylesheet" href="/css/syntax.css">

You might also need to add this to your _config.yml:

highlighter: pygments

Tested to work on Jekyll and also on GitHub Pages (which is special as it only allows a very limited set of plugins)

A related SO question that also assisted me in arriving to the right solution is here. I was also puzzled by why my code still wasn't highlighted in a template I'm porting over even after adding the line in _config.yml. The reason it just works on the auto-generated Jekyll site when doing jekyll new test-site is because the generated template already includes the SASS (.scss) for syntax-highlighting (in the _sass directory) which helps generate it all into one main.css.

Highlight with Jekyll and pygments doesn't work

2 Answers2

Linked