Grav code highlighting, themes and languages

June 19, 2016

Reading time ~1 minute

Grav has a great plugin for code highlighting.

It utilises the jQuery plugin highlight.js.

Markdown Extra allow the use of code fencing with 3 backticks. The plugin adds code highlighting by including the language name after the ticks. eg.


    ``` javascript
    code goes here  
    ```.

But I couldn't find a list of the supported languages, so I've pulled them out of the code:

Lang Lang Lang
apache bash coffeescript
cpp cs css
diff dts ini
java javascript json
http makefile markdown
nginx objectivec perl
php python ruby
sql twig xml
yaml

Grav can also change the syntax colouring theme with a change in the front matter.

Valid theme options are:

Theme Theme Theme
arta ascetic atelier-dune.dark
atelier-dune.light atelier-forest.dark atelier-forest.light
atelier-heath.dark atelier-heath.light atelier-lakeside.dark
atelier-lakeside.light atelier-seaside.dark atelier-seaside.light
brown_paper codepen-embed color-brewer
dark default docco
far foundation github
googlecode hybrid idea
ir_black kimbie.dark kimbie.light
learn magula mono-blue
monokai_sublime monokai obsidian
paraiso.dark paraiso.light pojoaque
railscasts rainbow school_book
solarized_dark solarized_light sunburst
tomorrow-night-blue tomorrow-night-bright tomorrow-night-eighties
tomorrow-night tomorrow vs
xcode zenburn agate
androidstudio atelier-cave.dark atelier-cave.light
atelier-estuary.dark atelier-estuary.light atelier-plateau.dark
atelier-plateau.light atelier-savanna.dark atelier-savanna.light
atelier-sulphurpool.dark atelier-sulphurpool.light darkula
github-gist pojoaque school_bank

View a live demo of the themes.

comments powered by Disqus