Jekyll & Liquid Cheatsheet

Running

Running a local server for testing purposes:

jekyll serve --watch

Creating a final outcome (or for testing on a server):

jekyll build --watch

On Windows you can get this error when building/serving:

Liquid Exception: incompatible character encodings: UTF-8 and IBM437 in index.html

You need to set the code-page first:

chcp 65001

Simple example of Output:

Hello {{name}}
Hello {{user.name}}
Hello {{ 'leszek' }}

Filtering output:

Word hello has {{ 'hello' | size }} letters!
Todat is {{ 'now' | date: "%Y %h" }}

Most common filters:

date -- reformat a date (syntax reference)
capitalize -- capitalize words in the input sentence
downcase -- convert an input string to lowercase
upcase -- convert an input string to uppercase
first -- get the first element of the passed in array
last -- get the last element of the passed in array
join -- join elements of the array with certain character between them
sort -- sort elements of the array
size -- return the size of an array or string
strip_newlines -- strip all newlines (\n) from string
replace -- replace each occurrence: {{ 'foofoo' | replace:'foo','bar' }}
replace_first -- replace the first occurrence: {{ 'barbar' | replace_first:'bar','foo' }}
remove -- remove each occurrence: {{ 'foobarfoobar' | remove:'foo' }}
remove_first -- remove the first occurrence: {{ 'barbar' | remove_first:'bar' }}
truncate -- truncate a string down to x characters
truncatewords -- truncate a string down to x words
prepend -- prepend a string: {{ 'bar' | prepend:'foo' }}
append -- append a string: {{ 'foo' | append:'bar' }}
minus, plus, times, divided_by, modulo -- working with numbers: {{ 4 | plus:2 }}
split -- split a string on a matching pattern: {{ "a~b" | split:~ }}

Tags are used for the logic in your template.

For swallowing content.

We made 1 million dollars {% comment %} in losses {% endcomment %} this year

Disables tag processing.

{% raw %}
    In Handlebars, {{ this }} will be HTML-escaped, but {{{ that }}} will not.
{% endraw %}

Simple expression with if/unless, elseif and else.

{% if user %}
    Hello {{ user.name }}
{% elsif user.name == "The Dude" %}
    Are you employed, sir?
{% else %}
    Who are you?
{% endif %}

{% unless user.name == "leszek" and user.race == "human" %}
    Hello non-human non-leszek
{% endunless %}

# array: [1,2,3]
{% if array contains 2 %}
    array includes 2
{% endif %}

For more conditions.

{% case condition %}
    {% when 1 %}
        hit 1
    {% when 2 or 3 %}
        hit 2 or 3
    {% else %}
        don't hit
{% endcase %}

Simple loop over a collection:

{% for item in array %}
    {{ item }}
{% endfor %}

Simple loop with iteration:

{% for i in (1..10) %}
    {{ i }}
{% endfor %}

There are helper variables for special occasions:

Limit and offset starting collection:

# array: [1,2,3,4,5,6]
{% for item in array limit:2 offset:2 %}
    {{ item }}
{% endfor %}

Storing data in variables:

{% assign name = 'leszek' %}

Combining multiple strings into one variable:

{% capture full-name %}{{ name }} {{ surname }}{% endcapture %}