Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
lib
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Jekyll Prism Plugin

Gittip

The Jekyll Prism plugin is a replacement for native Pygments syntax highlighting in Jekyll. It uses the Prism Syntax Highlighter.

The Setup

The Prism plugin is very easy to install and start using.

Copy prism.rb to your plugins folder and setup your layouts to use the Prism JavaScript and styles.

<html>
  <head>
    <link href="prism.css" rel="stylesheet" type="text/css">
  </head>
  <body>
    ...
    <!-- after all your content -->
    <script src="prism.js"></script>
  </body>
</html>

Getting Started

Much of my work on the plugin is based on the Jekyll's native highlight tag, and it's used much the same way.

For a plain, old vanilla experience (like you see on this page), the syntax is pretty straightforward.

... content ...
{% prism javascript %}
var obj = { 'foo': true, 'bar': false };

for (key in obj) {
  console.log(obj[key]);
}
{% endprism %}
... more content ...

Like Jekyll's highlight, the Prism plugin also can highlight lines using linenos. The value can be a comma-separated list or a range (1, 3-7).

Note: you need to include line highlighting in your Prism download for this to work.

... content ...
{% prism javascript linenos=1,4 %}
var obj = { 'foo': true, 'bar': false };

for (key in obj) {
  console.log(obj[key]);
}
{% endprism %}
... more content ...

And for something Prism doesn't offer out of the box, declaring linenos without a value will highlight all lines.

... content ...
{% prism javascript linenos %}
var obj = { 'foo': true, 'bar': false };

for (key in obj) {
  console.log(obj[key]);
}
{% endprism %}
... more content ...

About

Allows use of PrismJS on Jekyll sites.

Resources

Releases

No releases published

Languages

You can’t perform that action at this time.