Примеры применения Liquid

Материал из Insales Wiki
Версия от 07:18, 6 марта 2010; Vb (обсуждение | вклад) (Проверка количества товара на складе при добавлении в корзину с показом максимально возможного для заказа количества)

Перейти к: навигация, поиск


Кнопка «под заказ»

Можно показывать закончившийся товар на сайте, но при этом оповестить покупателей о том, что его можно получить «под заказ». Реализуется эта возможность в шаблоне. Например, в одном случае должна выводиться кнопка «Купить», а в другом случае – «Под заказ»:

     {% if product.available == true %}
          <input src="{{ 'buy.gif' | asset_url }}" type="image" />
     {% else %}
          <input src="{{ 'wait.gif' | asset_url }}" type="image" />
     {% endif %}

Такая логика работы поддерживается в стандартном шаблоне «Техника». В остальных шаблонах и в собственном дизайне её можно добавить, используя приведённый выше кусочек кода (естественно адаптировав его под себя).

Предложено в статье Какие товары показывать на сайте?

Задать число отображаемых товаров на странице витрины

Можно указать число товаров на странице витрины при просмотре:

В шаблоне "Категория" в строчках:

<ul>
  {% paginate products by 9 %}
  <table class="items">

  {% tablerow product in products cols: 3 %}
</ul> 

Измените числа 9 и 3 на нужные вам, первое число - это общее число товаров на странице, 3 - число колонок.

Из FAQ

Вывод товаров из произвольной категории в любом из шаблонов сайта

В качестве примера создадим отдельную скрытую категорию на сайте c путем /collection/special

В эту категорию мы будем добавлять товары, которые хотим вывести на главной странице. Напомним, что на сайте один товар может быть в нескольких категориях, поэтому для вывода уже существующих товаров нужно всего лишь разместить их и в этой спец-категории.

Теперь добавим код для вывода товаров в шаблон главной страницы. В самом простейшем виде:

{% for product in collections.special.products %}
{{ product.title }}
{% endfor %}

В качестве идентификатора категории используется ее пермалинк (постоянная ссылка), который мы указали в пути, в данном случае «special». Но этот пример выведет всего лишь список названий товаров, мы же хотим вывести полноценный список товаров с картинками, краткими описаниями и кнопками «Купить» и «Подробнее». Для этого на примере шаблона «Зеленый лист» скопируем код из шаблона «Категория» и слегка модифицируем его:

<div class="view-catalog">
<TABLE id="products-in-collection">
{% tablerow product in collections.special.products cols: 3 %}
<div class="node node-teaser" style="height: 300px;">
<div class="node-inner" id="product_{{ product.id }}" style="height: 230px; overflow: hidden;">
<div class="img"><a href="{{ product.url }}"><img src="{{ product.first_image.thumb_url }}" alt="[IMG]" title="{{ product.title | escape }}" /></a></div>
<h3 class="title"><a href="{{ product.url }}">{{ product.title | escape }}</a></h3>
<div class="content">
<p class="short-description">{{ product.short_description | truncate:100 }}</p>
</div>
</div>
<div class="buyzone">
<div class="price">{{ product.sale_price | money }}</div>
{% if product.variants.size == 1 %}
<form action="{{ cart_url }}" method="post" id="order">
<input type="hidden" name="variant_id" value="{{ product.variants.first.id }}">
<input type="submit" class="buy" value="" title="Купить"/>
<div class="readmore"><a href="{{ product.url }}">подробнее...</a></div>
</form>
{% else %}
<a href="{{ product.url }}" class="buy" title="Купить"></a>
<div class="readmore"><a href="{{ product.url }}">подробнее...</a></div>
{% endif %}
<BR class='clear'>
</div>
<BR class="clear">
</div>
{% endtablerow %}
</TABLE>
</div>

Мы убрали постраничный вывод и вывод текущей категории. Вставляем его в шаблон главной страницы сразу после блока:

<div class="content">{{ page.content }}</div>

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

Предложено в статье Вывод товаров на главной странице

Полужирное начертание

Проверка количества товара на складе

Проверка количества при добавлении в корзину

Можно сделать проверку количества товара на складе при добавлении в корзину на уровне шаблона. Цель - блокировка заказа большего, чем есть в наличии. Назначим свои переменные - "есть нехватка" и "предмет нехватки". Количество товара в модификации известно, количество его помещенного в корзину - тоже. В шаблоне Корзины (меню Сайт-Дизайн-Редактор) дополним код с кнопкой заказа.

В теме "Техника" блок кнопок оформления заказа выглядит так:

<div class="cart_reserve">
  <a href="#" class="cart_update" id="cart_update" style="display:none"><img src="{{ 'recalc.gif' | asset_url }}" /></a>
  <input id="create_order" type="submit" value="" name="make_order" />
</div>

Заменим предыдущий кусок на этот:

{% assign nehvatka = false %}
{% for item in cart.items %}{% if item.variant.quantity < item.quantity %}
{% assign nehvatka = true %}{% assign vinovnik = item.title %}
{% endif %}{% endfor %}
{% if nehvatka %}
<p style="margin: 20px;">Извините!<br />На складе недостаточно товара "<strong>{{ vinovnik }}</strong>". 
<br />Попробуйте уменьшить количество в Вашем заказе.</p>
<div class="cart_reserve">
<a href="#" class="cart_update" id="cart_update" style="display:none"><img src="{{ 'recalc.gif' | asset_url }}" /></a>
</div>
{% else %}
<div class="cart_reserve">
<a href="#" class="cart_update" id="cart_update" style="display:none"><img src="{{ 'recalc.gif' | asset_url }}" /></a>
<input id="create_order" type="submit" value="" name="make_order" />
</div>
{% endif %}

Теперь, если какого-то товара заказано больше чем есть на складе, умный код предупредит об этом и уберет кнопку чекаута.

Если тема шаблона - не "Техника", то изменяете блоки

<div class="cart_reserve">

сообразно коду кнопок в шаблоне.

Предложено пльзователем Victor на форуме 21.02.2010 г.

Показ максимально возможного для заказа количества товара

Проверка количества товара на складе при добавлении в корзину с показом максимально возможного для заказа количества

Это вариант предыдущего примера для шаблона «Техника»:

{% assign nehvatka = false %}
{% for item in cart.items %}
    {% if item.variant.quantity < item.quantity %}
        {% assign nehvatka = true %}
    {% endif %}
{% endfor %}
{% if nehvatka %}
<h2>Извините, но на складе недостаточно товара:</h2>
<ul class="error_list">
    {% for item in cart.items %}
        {% if item.variant.quantity < item.quantity %}
            <li>{{item.title}}<br/><em>Максимальное доступное количество: <span>{{item.variant.quantity}}</span></em></li>
        {% endif %}
    {% endfor %}
</ul>
<div class="cart_reserve">
    <a href="." class="cart_update" id="cart_update" style="display: none;">Пересчитать стоимость</a>
    <div class="clear"></div>
</div>
{% else %}
    <div class="cart_reserve">
        <a href="." class="cart_update" id="cart_update" style="display: none;">Пересчитать стоимость</a>
        <input class="create_order" id="create_order" type="submit" value="Оформить заказ" name="make_order"/>
        <div class="clear"></div>
    </div>
{% endif %}

Предложено пльзователем poison67 на форуме 02.03.2010 г.

Примечание: напрямую указывать точный остаток всех товаров может быть вредно для бизнеса!

Вывод сообщения о малости остатка возле кнопки добавления в корзину

Проверка суммарного количества оставшихся модификаций товара на складе и, если количество менее заданного - выврд сообщения об оставшемся количестве возле кнопки добавления в корзину.

Сделаем расчет количества. В шаблоне Товара (меню Сайт->Дизайн->Редактор->Товар), ищем код кнопки добавления в корзину:

<form action="{{ cart_url }}" method="post" id="order">
<div>
здесь
куча
текста
<input class="buy add_button" type="submit" value="Добавить в корзину" />
</div>

сразу после него добавляем:

{% assign panic = '' %}{% for variant in product.variants %}{% if variant.available %}
{% capture panic %}{% if variant.quantity < 3 %}{{variant.quantity|times:5|append:panic}}{% else %}{{variant.quantity|times:300|append:panic}}{% endif%}{% endcapture %}
{% assign panic = {{panic}} %}{% endif %}{% endfor %}
{% if panic.size > 0 and panic.size < 4 %}<h3>Торопитесь!<br />осталось {{panic|size}} шт!</h3>{% endif %}

Теперь, если какой-то товар есть в количестве менее 4, то будет выводиться сообщение возле кнопки добавления его в корзину.

Предложено пльзователем Victor на форуме 05.03.2010 г. </blockquote>