💬 Join the CloudCannon Community to connect, learn, and share ✨

Jekyll logo

Jekyll Cheatsheet

Learn everything Jekyll is capable of from an exhaustive list of variables, tags, and filters.

Collection variables Docs

Document variables Docs

Global variables Docs

  • content

    In layout files, the rendered content of the Post or Page being wrapped. Not defined in Post or Page files.

  • page

    Page specific information + the YAML front matter. Custom variables set via the YAML Front Matter will be available here.

  • site

    Sitewide information + configuration settings from `_config.yml`.

Liquid filters - array Docs

  • array_to_sentence_string

    Append characters to a string.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | array_to_sentence_string }}
    {{ page.my_array | array_to_sentence_string: 'or' }}
    Output Direct link to this section
    a, b, and c
    a, b, or c

  • first

    Get the first element of the passed in array.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | first }}
    Output Direct link to this section
    a

  • group_by

    Group an array's items by a given property.

    Input Direct link to this section
    <!-- page.people is
    - name: "John"
      school: "Stanford"
    - name: "Jane"
      school: "Stanford"
    - name: "Joe"
      school: "Harvard"
    -->
    {{ page.people | group_by: "school" }}
    Output Direct link to this section
    {
      "name"=>"Stanford",
      "items"=>[{
        "name"=>"John",
        "school"=>"Stanford"
      }, {
        "name"=>"Jane",
        "school"=>"Stanford"
      }]
    },
    {
      "name"=>"Harvard",
      "items"=>[{
        "name"=>"Joe",
        "school"=>"Harvard"
      }]
    }

  • group_by_exp

    Group an array's items using a Liquid expression.

    Input Direct link to this section
    <!-- page.people is
      - name: "John"
        school: "Stanford"
        year: 2016
      - name: "Jane"
        school: "Stanford"
        year: 2017
      - name: "Joe"
        school: "Harvard"
        year: 2015
    -->
    {{ page.people | group_by_exp: "item", "item.name | size" }}

    {{ page.people | group_by_exp: "item", "item.year | modulo: 2" }}

    {{ page.people | group_by_exp: "item", "item.school | replace: 'rd', 'ry' " }}
    Output Direct link to this section
    {"name"=>4, "items"=>[{"name"=>"John", "school"=>"Stanford", "year"=>2016}, {"name"=>"Jane", "school"=>"Stanford", "year"=>2017}], "size"=>2}{"name"=>3, "items"=>[{"name"=>"Joe", "school"=>"Harvard", "year"=>2015}], "size"=>1}

    {"name"=>0, "items"=>[{"name"=>"John", "school"=>"Stanford", "year"=>2016}], "size"=>1}{"name"=>1, "items"=>[{"name"=>"Jane", "school"=>"Stanford", "year"=>2017}, {"name"=>"Joe", "school"=>"Harvard", "year"=>2015}], "size"=>2}

    {"name"=>"Stanfory", "items"=>[{"name"=>"John", "school"=>"Stanford", "year"=>2016}, {"name"=>"Jane", "school"=>"Stanford", "year"=>2017}], "size"=>2}{"name"=>"Harvary", "items"=>[{"name"=>"Joe", "school"=>"Harvard", "year"=>2015}], "size"=>1}

  • join

    Joins an array with the specified character.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | join: ', ' }}
    Output Direct link to this section
    a, b, c

  • jsonify

    Convert Hash or Array to JSON.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | jsonify }}
    Output Direct link to this section
    ["a","b","c"]

  • last

    Get the last element of the passed in array.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | last }}
    Output Direct link to this section
    c

  • map

    Accepts an array element's attribute as a parameter and creates a string out of each array element's value.

    Input Direct link to this section
    <!-- page.people is
      - name: "John"
        school: "Stanford"
      - name: "Jane"
        school: "Stanford"
      - name: "Joe"
        school: "Harvard"
    -->
    {{ page.people | map: "name" }}
    Output Direct link to this section
    JohnJaneJoe

  • push

    Adds an object to a array.

    Input Direct link to this section
    {% assign my_array = "a,b,c" | split:"," %}
    {% assign my_array = my_array | push: 'd' %}

    {{ my_array | array_to_sentence_string }}
    Output Direct link to this section
    a, b, c, and d

  • size

    Return the size of an array or string.

    Input Direct link to this section
    <!-- page.my_array is ['a', 'b', 'c'] -->
    {{ page.my_array | size }}
    Output Direct link to this section
    3

  • sort

    Sorts an array.

    Input Direct link to this section
    <!-- page.my_array is ['c', 'a', 'b'] -->
    {{ page.my_array | sort }}
    Output Direct link to this section
    ['a','b','c']

    You can add a argument to sort on a property name:

    Input Direct link to this section
    {{ page.posts | sort: 'author' }}

    And also add a second argument to say whether the nils should be first or last:

    Input Direct link to this section
    {{ page.posts | sort: 'author', 'last' }}

  • uniq

    Removes duplicate elements from an array.

    Input Direct link to this section
    <!-- page.my_array is ['cat', 'dog', 'mouse', 'cat'] -->
    {{ page.my_array | uniq }}
    Output Direct link to this section
    'cat', 'dog', 'mouse'

  • where

    Select all the objects in an array where the key has the given value.

    Input Direct link to this section
    <!-- page.people is
      - name: "John"
        school: "Stanford"
      - name: "Jane"
        school: "Stanford"
      - name: "Joe"
        school: "Harvard"
    -->
    {{ page.people | where: "school", "Stanford" }}
    Output Direct link to this section
    {"name"=>"John", "school"=>"Stanford"}{"name"=>"Jane", "school"=>"Stanford"}

  • where_exp

    Select all the objects in an array where the expression is true.

    Input Direct link to this section
    <!-- page.people is
      - name: "John"
        school: "Stanford"
        year: 2016
      - name: "Jane"
        school: "Stanford"
        year: 2017
      - name: "Joe"
        school: "Harvard"
        year: 2015
    -->
    {{ page.people | where_exp: "item", "item.name contains 'Jo'" }}

    {{ page.people | where_exp: "item", "item.year >= 2016" }}

    {{ page.people | where_exp: "item", "item.school != "Stanford" }}
    Output Direct link to this section
    {"name"=>"John", "school"=>"Stanford", "year"=>2016}{"name"=>"Joe", "school"=>"Harvard", "year"=>2015}

    {"name"=>"John", "school"=>"Stanford", "year"=>2016}{"name"=>"Jane", "school"=>"Stanford", "year"=>2017}

    {"name"=>"Joe", "school"=>"Harvard", "year"=>2015}

Liquid filters - date Docs

  • date

    Converts a date into another format.

    Input Direct link to this section
    {{ site.time | date: "%a, %b %d, %y" }}
    Output Direct link to this section
    Wed, Jan 27, 16
    • %a - Abbreviated weekday (Sun)
    • %A - Full weekday name (Sunday)
    • %b - Abbreviated month name (Jan)
    • %B - Full month name (January)
    • %c - Preferred local date and time representation (Fri Jan 29 11:16:09 2016)
    • %d - Day of the month, zero-padded (05)
    • %-d - Day of the month (5)
    • %D - Formats the date (29/01/16).
    • %e - Day of the month (3).
    • %F - Returns the date in ISO 8601 format (2016-01-29).
    • %H - Hour of the day, 24-hour clock (07)
    • %I - Hour of the day, 12-hour clock (04)
    • %j - Day of the year (017)
    • %k - Hour of the day, 24-hour clock (7)
    • %m - Month of the year (04)
    • %M - Minute of the hour (09)
    • %p - Meridian indicator uppercase (AM)
    • %P - Meridian indicator lowercase (pm)
    • %r - 12-hour time (01:31:43 PM)
    • %R - 24-hour time (18:09)
    • %T - 24-hour time with seconds (18:09:13)
    • %s - Number of seconds since 1970-01-01 00:00:00 UTC (1452355261)
    • %S - Second of the minute (05)
    • %U - Week number of the current year, starting with the first Sunday as the first day of the first week (03)
    • %W - Week number of the current year, starting with the first Monday as the first day of the first week (09)
    • %w - Day of the week. Sunday is 0 (4)
    • %x - Preferred representation for the date (05/11/15)
    • %X - Preferred representation for the time (17:15:31)
    • %y - Year without a century (16)
    • %Y - Year with century (2016)
    • %Z - Time zone name (PST)
    • %% - Literal % character

  • date_to_long_string

    Convert a date to long format.

    Input Direct link to this section
    {{ site.time | date_to_long_string }}
    Output Direct link to this section
    01 January 2016

  • date_to_long_rfc822

    Convert a Date into RFC-822 format.

    Input Direct link to this section
    {{ site.time | date_to_rfc822 }}
    Output Direct link to this section
    Mon, 07 Nov 2008 13:07:54 -0800

  • date_to_string

    Convert a date to short format.

    Input Direct link to this section
    {{ site.time | date_to_string }}
    Output Direct link to this section
    01 Jan 2016

  • date_to_xmlschema

    Convert a Date into ISO 8601 format.

    Input Direct link to this section
    {{ site.time | date_to_xmlschema }}
    Output Direct link to this section
    2008-11-07T13:07:54-08:00

Liquid filters - integer Docs

Liquid filters - string Docs

Liquid for loops Docs

Liquid tags - control flow Docs

  • case

    Creates a switch statement to compare a variable with different values. `case` initializes the switch statement, and `when` compares its values.

    Input Direct link to this section
    <!-- page.name is set to "home" -->
    {% case page.name %}
      {% when 'home' %}
        Home Page
      {% when 'about' %}
        About Page
      {% else %}
        Contact Page
    {% endcase %}
    Output Direct link to this section
    Home Page

  • elsif

    Adds more conditions to an `if` or `unless` block.

    Input Direct link to this section
    <!-- page.name is set to "contact" -->
    {% if page.name == 'about' %}
      About Page
    {% elsif page.name == 'contact' %}
      Contact Page
    {% else %}
      Other Page
    {% endif %}
    Output Direct link to this section
    Contact Page

  • if

    Executes a block of code only if a certain condition is met.

    Input Direct link to this section
    <!-- page.name is set to "about" -->
    {% if page.name == 'about' %}
      About Page
    {% endif %}
    Output Direct link to this section
      About Page

  • operations

    Operators used in logic statements.

    • == equal
    • != not equal
    • > bigger than
    • < less than
    • >= bigger or equal
    • <= less or equal
    • or this or that
    • and must be this and that
    • contains includes the substring if used on a string, or element if used on an array

  • unless

    Similar to `if`, but executes a block of code only if a certain condition is **not** met.

    Input Direct link to this section
    <!-- page.name is set to "about" -->
    {% unless page.name == "contact" %}
      It's not the contact page
    {% endunless %}
    Output Direct link to this section
    It's not the contact page

    Which is the same as doing:

    {% if page.name != "contact" %}
      It's not the contact page
    {% endif %}

Liquid tags - iteration Docs

Liquid tags - other Docs

Liquid tags - variable Docs

Markdown Docs

Page variables Docs

Post variables Docs

Site variables Docs

Static file variables Docs

Yaml Docs