What is liquid?¶

Liquid is an open source template language created originally by Shopify, and written in Ruby.

The Experience Builder Liquid engine is a custom c# implementation of liquid. It has extended the original concepts to provide a rich set of tools for building pages, working with data inside the Experience Builder System.

Liquid Basics¶

Liquid uses a combination of objects, tags, and filters inside page files to display dynamic content.

Objects¶

Objects contain the content that Liquid displays on a page. Objects and variables are displayed when enclosed in double curly braces: {{ and }}.

Example

    {{ page.title }}

Output

    Introduction

In this case, Liquid is rendering the content of the title property of the page object, which contains the text Introduction.

Tags¶

Tags create the logic and flow for pages. The curly brace percentage delimiters {% and %} and the text that they surround do not produce any visible output when the page is rendered. This lets you assign variables and create conditions or loops without displaying any of the Liquid logic on the page.

Example

    {% if user %}
      Hello {{ user.name }}!
    {% endif %}

Output

      Hello Adam!

Tags can be categorized into various types:

You can read more about each type of tag in the tag glossary

Filters¶

Filters change the output of a Liquid object or variable. They are used within double curly braces {{ }} and come after the first part of the filter expression separated bg a pipe |.

Example

    {{ "/my/fancy/url" | append: ".html" }}

Output

    /my/fancy/url.html

Multiple filters can be used on one output, and are applied from left to right.

Example

    {{ "adam!" | capitalize | prepend: "Hello " }}

Output

    Hello Adam!

An extensive list of filters can be found here