Инструкция по подготовке вёрстки триггера с блоком рекомендаций
Поддерживаемые переменные о товаре
Пример вёрстки товарного блока
В вёрстке письма используются 2 цикла: причина рекомендации (например, просмотренные товары или товары из корзины) и рекомендуемые товары. Исходные товары (причина рекомендаций) находятся в массиве s_products, рекомендуемые товары находятся в массиве r_products. Чтобы вывести все товары из массива, нужен оператор цикла. Синтаксис на примере массива с исходными товарами {% for product in s_products %}...{% endfor %}. Внутри цикла подставляются переменные о товаре. Полный список переменных вверху страницы.
<html>
<body>
...
<h2>Товары в корзине</h2>
{% for product in s_products %} //начало цикла, в каждой итерации берётся следующий элемент из массива s_products
<div>
<p><a href="{{ product.url }}"><img src="{{ product.image_url }}"/></a></p>
<p>{{ product.name }}, {{ product.amount }} шт., {{ product.price }} руб.</p>
</div>
{% endfor %} //конец цикла
<h2>Рекомендуем посмотреть</h2>
{% for product in r_products %} //начало цикла, в каждой итерации берётся следующий элемент из массива r_products
<div>
<p><a href="{{ product.url }}"><img src="{{ product.image_url }}"/></a></p>
<p>{{ product.name }}, {{ product.price }} руб.</p>
</div>
{% endfor %} //конец цикла
...
</body>
</html>Использование оператора if
У товара есть 2 цены: до скидки и после. Предположим, что не у всех товаров есть цена до скидки (другими словами не на все товары есть скидка). Тогда в вёрстке нужно использовать проверку {% if product.oldprice %}
{% for product in r_products %}
...
<p>
Цена:
{% if product.oldprice %}<strike>{{ product.oldprice }} руб.</strike>{% endif %}
{{ product.price }} руб.
</p>
...
{% endfor %}Важно при подготовке вёрстки не вставлять опертаор {% for %} или {% if %} между тегами <table> и <td>. Иначе при сохранении письма операторы автоматически перместятся перед <table> и вёрстка "поедет".
Использование переменной forloop.first или forloop.last
Используемая ниже конструкция {% if forloop.first %} будет срабатывать для первого элемента в массиве, а конструкция
{% if forloop.last %} соответственно для последнего. Например, это может быть полезно, когда все товары кроме последнего разделены между собой горизонтальной полосой.
{% if forloop.last %} соответственно для последнего. Например, это может быть полезно, когда все товары кроме последнего разделены между собой горизонтальной полосой.
{% for product in r_products %}
<div>...</div>
{% if not forloop.last %}<hr/>{% endif %}
{% endfor %}Использование переменной forloop.counter
Переменная {{ forloop.counter }} выводит текущий счётчик цикла. Например, его можно использовать для отображения в письме количества товаров в корзине.
{% for product in s_products %}
<div>...</div>
{% if forloop.last %}В корзине {{ forloop.counter }} товаров{% endif %}
{% endfor %}Другой пример, если требуется в строго ограничить количество отображаемых товаров до 6. При этом по 3 товар в каждом ряду.
<table>
<tr>
{% for product in r_products %}
{% if forloop.counter <= 3 %}
<td>...</td>
{% endif %}
{% endfor %}
</tr>
<tr>
{% for product in r_products %}
{% if forloop.counter > 3 and forloop.counter <= 6 %}
<td>...</td>
{% endif %}
{% endfor %}
<tr>
</table>Вот так выглядел бы тот же самый пример, только оптимизированный с точки зрения использования количества циклов.
<table>
<tr>
{% for product in r_products %}
{% if forloop.counter <= 3 %}
<td>...</td>
{% endif %}
{% if forloop.counter == 3 %}
</tr>
<tr>
{% endif %}
{% if forloop.counter > 3 and forloop.counter <= 6 %}
<td>...</td>
{% endif %}
{% endfor %}
<tr>
</table>