Liquid

Про Liquid

Для управление дизайном в InSales используется язык шаблонов Liquid. Это простой в освоении и достаточно мощный язык. Он был разработан компанией jadedPixel в рамках проекта shopify.com и сейчас является open source проектом. Более подробная информация о нем, а так же полная документация на английском языке находится на сайте: http://www.liquidmarkup.org/. Более подробная инструкция http://wiki.github.com/tobi/liquid/liquid-for-designers. Справочник: http://liquid.rubyforge.org/.

Введение

В языке Liquid есть два основных вида конструкций: Вывод данных (Output) и Теги (Tag).

• Вывод данных заключается в {{ двойные фигурные скобки }}
• Теги заключаются в {% фигурные скобки с процентом %}

Блики вывода данных всегда заменяются на то на что они ссылаются. Если ваш в ваш шаблон передается информация о товаре через переменную product, то конструкция {{ product.title }} выведет его имя.

Теги управляют логикой шаблонов. При их помощи вы можете организовывать циклы и логику ветвления.

Вывод данных

Пример вывода данных:

 Привет, {{ name }}!

Привет, {{ user.name }}!

Привет, {{ 'Имярек' }}!

Фильтры

Для преобразования выходных данных можно использовать фильтры. Фильтры это обычные функции. Первый аргумент пишется слева от имени фильтра.

 Привет, {{ name | upcase }}!

 В слове 'магазин' {{ 'магазин' | length }} букв

 {{ product.sale_price | money }} 

Результат выполнения фильтра может быть первым аргументом для следующего фильтра, находящегося справа от него, если таковой имеется.

 {{ array | sort | last }} 

Если у фильтра больше одного аргумента то остальные аргументы перечисляются справа от имени фильтра после ':' через запятую:

 {{ 'Яндекс' | link_to: 'http://yandex.ru' }} => <a href="http://yandex.ru" title="">Яндекс</a> 

 {{ 'Яндекс' | link_to: 'http://yandex.ru', 'ссылка на яндекс' }} => <a href="http://yandex.ru" title="ссылка на яндекс">Яндекс</a> 

Список стандартных фильтров

• capitalize – сделать первую букву строки заглавной
• date – преобразовать дату в нужный формат
• downcase – привести строку к нижнему регистру
• first – вернуть первый элемент массива
• join – соединить элементы массива в строку
• last – вернуть последний элемент массива
• size – вернуть размер массива или строки
• sort – отсортировать массив
• strip_html – вырезать html-теги
• truncate – обрезать строку до x символов
• truncatewords - обрезить строку до x слов
• upcase – привести строку к верхнему регистру

Выражения сравнения

При сравнении доступны следующие операторы:

==	равенство
!=	неравенство
<>	неравенство
<	меньше
>	больше
>=	больше либо равно
<=	меньше либо равно
contains	строка слева содержит строку справа
and	логическое и
or	логическое и

Для вызова фильтров при сравнении надо использовать '.', а на '|'. Таким образом можно использовать только фильтры с одним аргументом.

 {% if array.size > 10 %}   - правильно
 {% if array | size > 10 %} - не правильно

Обратите внимание, что нет оператора отрицания, если вам нужно отрицание, надо либо преобразовать условие, либо использовать else, а основную ветку оставить пустой.

  {% if product.title contains 'asus' %}
  {% else %}
     ...
  {% end %}

При сравнении объектов разного типа, например, чисел со строками, всегда возвращается false.

  {% if products.size == 0 %}    - правильно
  {% if products.size == '0'  %} - неправильно

При обращении к несуществующим методам тоже возвращается false.

  {% if products.size == 0 %}    - правильно
  {% if products.empty %}        - не вернет ошибку, но будет всегда возвращать false 

Список значений, которые при приведении к Boolean становятся false в языке Liquid совпадает с языком ruby, который сильно отличается от, аналогичного списка в PHP.

False

• false
• nil

True - все остальное

• “”
• 0
• “0”
• “false”

Теги

Теги используются для управления выводом в шаблоне.

Комментарии

{% comment %} закомментированный текст {% endcomment %}

Условия if / else

{% if user %}
  Привет {{ user.name }}
{% endif %}

Цикл For

Цикл для обхода массивов

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

При обходе массива доступны дополнительные переменные:

 forloop.length      # => количество элементов в массиве
 forloop.index       # => номер текущей итерации 
 forloop.index0      # => номер текущей итерации (считая от нуля) 
 forloop.rindex      # => сколько элементов осталось
 forloop.rindex0     # => сколько элементов осталось (считая от нуля)
 forloop.first       # => первая итерация?
 forloop.last        # => последняя итерация?

Можно задавать сдвиг и максимальное числое элементов для обхода:

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

Таблицы

По аналогии с циклом for можно создавать таблицы:

  {% tablerow item in items cols: 2 limit: 6 %}
    {{ item }}
  {% endtablerow %}

 Дополнительные переменные, доступные при обходе массива:

 tablerowloop.length       # => количество элементов в массиве
 tablerowloop.index        # => номер текущей итерации 
 tablerowloop.index0       # => номер текущей итерации (считая с нуля) 
 tablerowloop.rindex       # => сколько элементов осталось
 tablerowloop.rindex0      # => сколько элементов осталось (считая  с нуля)
 tablerowloop.first        # => первый элемент?
 tablerowloop.last         # => последний элемент? 
 tablerowloop.col          # => номер колонки в текущей строчке
 tablerowloop.col0         # => номер колонки в текущей строчке (считая с нуля)
 tablerowloop.col_first    # => первая колонка?
 tablerowloop.col_last     # => последняя колонка?