Adding syntax highlighting with Prism to Ghost

If you are a developer like me, you will want to probably highlight code snippets on your blog. Unfortunately, Ghost doesn't have native support for it. Lucky enough, it is not a big problem because there are many solutions that you can easily include in your template and the code will be highlighted. After small research I have decided to go with Prism because I was looking for something that supports Swift.

Installing Prism

To install it, you need to follow a few steps.

1. Visit http://prismjs.com/download.html
2. Pick languages and plugins that you want to have.
3. Scroll down and download js and css.
4. After that copy these files into your theme. In case you use default theme, it should be content/themes/casper/assets/js for the JavaScript file and content/themes/casper/assets/css for the style sheet file.
5. Modify content/themes/casper/default.hbs by adding following tags after respective comments and once you are done, upload your Ghost installation to your server.

{{! Styles'n'Scripts }}
<link rel="stylesheet" type="text/css" href="{{asset "css/prism.css"}}"/>

{{!-- jQuery + Fitvids, which makes all video embeds responsive --}}
<script type="text/javascript" src="{{asset "js/prism.js"}}"></script>

Usage

For marking text as code Ghost uses triple back-ticks. After that you specify a name of language that you want syntax highlight.

 ```swift
 ```

And in middle of that you put your code that you want be highlighted.

func hello(name: String) -> String {
    return "Hello, \(name)"
}

These instructions are valid for Ghost 1.5.