Import files on your filesystem into any blog post as embedded code snippets with syntax highlighting and a download link. In the _config.yml you can set your code_dir but the default is source/downloads/code. Simply put a file anywhere under that directory and use the following tag to embed it in a post.

Syntax

{% include_code [title] url %}

Example 1

{% include_code javascripts/test.js %}

Example 2 (with optional title)

{% include_code Testing include_code javascripts/test.js %}

This includes a file from source/downloads/code/javascripts/test.js. By default the <figcaption> will be the filename, but you can add a title before the filepath if you like.

Demo of Example 2

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

/**
sample javascript from xui
*/

var undefined,
    xui,
    window     = this,
    string     = new String('string'),
    document   = window.document,
    simpleExpr = /^#?([\w-]+)$/,
    idExpr     = /^#/,
    tagExpr    = /<([\w:]+)/,
    slice      = function (e) { return [].slice.call(e, 0); };
    try { var a = slice(document.documentElement.childNodes)[0].nodeType; }
    catch(e){ slice = function (e) { var ret=[]; for (var i=0; e[i]; i++)
        ret.push(e[i]); return ret; }; }

window.x$ = window.xui = xui = function(q, context) {
    return new xui.fn.find(q, context);
};