Переменные доступные в шаблоне product.liquid, а так же в цикле продуктов коллекции.
{% if product.available %}
Товар в наличии
{% else %}
Товара нет в наличии
{% endif %}
{% for collection in product.collections %}
{{ collection.title }}
{% endfor %}
На странице товара:
{{ product.description }}
Внутри массива товаров:
{% for product in collection.products %}
{{ product.description }}
{% endfor %}
Ссылка на первое изображение товара:
{{ product.first_image.medium_url }}
Имя первого изображения товара:
{{ product.first_image.title }}
Имя файла первого изображения товара:
{{ product.first_image.file_name}}
Возможные размеры:
48x48 small_url
100x100 thumb_url
160x160 compact_url
240x240 medium_url
480x480 large_url
original image original_url
Ссылка на товар - demo.myinsales.ru/product/my_product
{{ product.handle }}
>> my_product
<form action="{{ cart_url }}" method="post" data-product-id="{{ product.id }}">
{% if product.show_variants? %}
<select name="variant_id" data-product-variants>
{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title | escape }}</option>
{% endfor %}
</select>
{% else %}
<input type="hidden" name="variant_id" value="{{product.variants.first.id}}" >
{% endif %}
<input type="text" name="comment" value="">
<div data-quantity>
<input type="text" name="quantity" value="1" />
<span data-quantity-change="-1">-</span>
<span data-quantity-change="1">+</span>
</div>
<button type="submit" data-item-add>
Добавить в корзину
</button>
</form>
<div class="images">
{% for image in product.images %}
<div class="images-item">
<img src="{{ image.large_url }}" alt="{{ image.title }} " />
</div>
{% endfor %}
</div>
meta description страницы товара
<meta name="description" content="{{ product.meta_description }}">
На всём сайте следует пользваться следующим примером:
<meta name="description" content="{{ description }}">
meta keywords страницы товара
{% if product.meta_keywords %}
Meta keywords страницы товара: {{ product.meta_keywords }}
{% endif %}
Старая цена товара (цена до скидки).
{% if product.old_price %}
Старая цена: {{ product.old_price | money }}
{% endif %}
Максимальная старая цена товара (если несколько модификаций).
{% if product.old_price_varies? %}
{{ product.old_price_min }} - {{ product.old_price_max }}
{% else %}
{{ product.old_price }}
{% endif %}
Минимальная старая цена товара (если несколько модификаций).
{% if product.old_price_varies? %}
{{ product.old_price_min }} - {{ product.old_price_max }}
{% else %}
{{ product.old_price }}
{% endif %}
Отличаются ли старые цены на модификации у товара (если несколько модификаций).
{% if product.old_price_varies? %}
{{ product.old_price_min }} - {{ product.old_price_max }}
{% else %}
{{ product.old_price }}
{% endif %}
Свойства товара. Например, вывод всех свойств товара вместе с их значениями
{% for option in product.options %}
{{ option.title }} : {% for value in option.values %}{{ value.title }}{% unless forloop.last %},{% endunless %}{% endfor %}
{% endfor %}
Цена товара (минимальная цена, если несколько модификаций).
{{ product.price | money }}
Максимальная цена товара (если несколько модификаций).
{% if product.price_varies? %}
от {{ product.price_min | money }} до {{ product.price_max | money }}
{% endif %}
Минимальная цена товара (если несколько модификаций).
{% if product.price_varies? %}
от {{ product.price_min | money }} до {{ product.price_max | money }}
{% endif %}
Отличаются ли цены на модификации у товара (если несколько модификаций).
{% if product.price_varies? %}
от {{ product.price_min | money }} до {{ product.price_max | money }}
{% endif %}
Параметры товара.
{% for property in product.properties %}
{{property.name}}: {% for item in property.characteristics %}{{item.name}},{% endfor %}
{% endfor %}
Так же можно обращаться к параметру напрямую, зная его пермалинк (handle):
{{ product.properties.handle.characteristics.first.name }}
Рейтинг товара, основанный на отзывах.
{% if product.rating %}
Рейтинг товара: {{ product.rating }}
{% endif %}
Массив отзывов на товар
{% if account.reviews_enabled? %}
{% if product.reviews == empty %}
<div class="notice notice--info">
Пока нет отзывов
</div>
{% else %}
<ul class="reviews-list">
{% for review in product.reviews %}
<li class="review">
<div class="review-details">
<span class="review-name">{{ review.author }}</span> {{ review.created_at | date: "%d.%m.%Y %H:%M" }}
</div>
<div class="review-content">
{{ review.content | newline_to_br }}
</div>
{% if review.rating %}
<div class="review-rating rating">
Оценка: {{ review.rating }}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
Количество отзывов на товар.
{% if product.reviews_count > 0 %}
<ul class="reviews-list">
{% for review in product.reviews %}
<li class="review">
<div class="review-details">
<span class="review-name">{{ review.author }}</span> {{ review.created_at | date: "%d.%m.%Y %H:%M" }}
</div>
<div class="review-content">
{{ review.content | newline_to_br }}
</div>
{% if review.rating %}
<div class="review-rating rating">
Оценка: {{ review.rating }}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
Краткое описание товара.
{% if product.short_description %}
<div class="product-short_description">
{{ product.short_description }}
</div>
{% endif %}
Есть ли модификации для отображения (true, если больше одной, либо если одна и она не является дефолтной базовой модификацией).
{% if product.show_variants? %}
<div class="product-variants">
<select name="variant_id" id="variant-select">
{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title | escape }}</option>
{% endfor %}
</select>
</div>
{% else %}
<input type="hidden" name="variant_id" value="{{ product.variants.first.id }}" />
{% endif %}
Аналогичные товары.
{% if product.similar_products.size > 0 %}
<div class="similar_products">
<div class="similar_products-title">
Аналогичные товары
</div>
<div class="similar_products-slider">
{% for product in product.similar_products %}
<div class="product_preview">
<div class="product_preview-img">
<a href="{{ product.url }}">
<img src="{{ product.first_image.large_url }}" alt="{{ product.title }}" />
</a>
</div>
<div class="product_preview-price">
{{ product.price | money }}
</div>
<div class="product_preview-title">
<a href="{{ product.url }}">
{{ product.title }}
</a>
</div>
</div>
{% endfor %}
</div>
</div>
{% endif %}
Название товара.
<div class="product">
<div class="product-title">
{{ product.title }}
</div>
{% if product.description %}
<div class="product-description">
{{ product.description }}
</div>
{% endif %}
</div>
JSON-объект товара.
// результат функции console.log({{product | json}}), использовать можно только в ликвид файле, а именно шаблоне product.liquid
{
'id': 60749685,
'url': '/collection/napitki/product/mokkachino',
'title': 'Моккачино',
'short_description': 'Мокаччи́но — кофейный напиток, созданный в Америке и являющийся разновидностью латте с добавлением шоколада.',
'available': true,
'unit': 'pce',
'permalink': 'mokkachino',
'images': [ {
'created_at': '2016-06-16T14:06:21+03:00',
'id': 82136971,
'image_processing': false,
'position': 1,
'product_id': 60749685,
'title': null,
'url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/thumb_Mokkachino.jpg',
'original_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/Mokkachino.jpg',
'medium_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/medium_Mokkachino.jpg',
'small_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/micro_Mokkachino.jpg',
'thumb_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/thumb_Mokkachino.jpg',
'compact_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/compact_Mokkachino.jpg',
'large_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/large_Mokkachino.jpg',
'filename': 'Mokkachino.jpg'
} ],
'first_image': {
'created_at': '2016-06-16T14:06:21+03:00',
'id': 82136971,
'image_processing': false,
'position': 1,
'product_id': 60749685,
'title': null,
'url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/thumb_Mokkachino.jpg',
'original_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/Mokkachino.jpg',
'medium_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/medium_Mokkachino.jpg',
'small_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/micro_Mokkachino.jpg',
'thumb_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/thumb_Mokkachino.jpg',
'compact_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/compact_Mokkachino.jpg',
'large_url': 'https://static-eu.insales.ru/images/products/1/3979/82136971/large_Mokkachino.jpg',
'filename': 'Mokkachino.jpg'
},
'category_id': 4911689,
'canonical_url_collection_id': 5681718,
'price_kinds': [ ],
'option_names': [ {
'id': 612392,
'position': 1,
'title': 'Размер'
} ],
'properties': [ {
'backoffice': false,
'id': 2018587,
'is_hidden': false,
'is_navigational': true,
'position': 2,
'permalink': 'ingredient',
'title': 'Ингредиент'
} ],
'characteristics': [ {
'id': 19611934,
'property_id': 2018587,
'position': 1,
'title': 'шоколад',
'permalink': 'shokolad'
} ],
'variants': [ {
'id': 95292397,
'available': true,
'product_id': 60749685,
'title': 'Стандарт',
'base_price': '120.0',
'prices': [ ],
'price': '120.0',
'old_price': null,
'sku': null,
'barcode': null,
'option_values': [ {
'id': 5954429,
'option_name_id': 612392,
'position': 8,
'title': 'Стандарт'
} ],
'quantity': null,
'weight': null,
'created_at': '2016-06-16T14:06:10+03:00',
'updated_at': '2016-06-16T14:08:29+03:00'
}, {
'id': 95292614,
'available': true,
'product_id': 60749685,
'title': 'Большой',
'base_price': '150.0',
'prices': [ ],
'price': '150.0',
'old_price': null,
'sku': null,
'barcode': null,
'option_values': [ {
'id': 5954430,
'option_name_id': 612392,
'position': 9,
'title': 'Большой'
} ],
'quantity': null,
'weight': null,
'created_at': '2016-06-16T14:08:40+03:00',
'updated_at': '2016-06-16T14:08:44+03:00'
} ]
}
Единица измерения товара. Доступные значения: "шт", "кг", "л; дм3", "м", "м2", "г", "т"
{{ product.unit }}
>> шт
URL продукта
{% for product in collection.products %}
<a href="{{ product.url }}">{{ product.title }}</a>
{% endfor %}
Модификации товара.
{% if product.show_variants? %}
<div class="product-variants">
<select name="variant_id" id="variant-select">
{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title | escape }}</option>
{% endfor %}
</select>
</div>
{% else %}
<input type="hidden" name="variant_id" value="{{ product.variants.first.id }}" />
{% endif %}
возвращает дополнительные поля товара в формате пермалинк:значение. Например, есть поле "Название книги", с пермалинком - "book" и со значением для конкретного товара "Как увеличить продажи в интернете"
{{ product.fields.book.value }},{{ product.fields.book.title }}
>> "Как увеличить продажи в интернете","Название книги"
Является ли товар комплектом?
{% if product.is_bundle %}
<div class="bundle">
<div class="bundle-title">
Состав комплекта:
</div>
<div class="bundle-list">
{% for bundle_component in product.bundle_components %}
<div class="bundle-item">
<div class="bundle-img">
<img src="{{ bundle_component.product.first_image.medium_url }}" />
</div>
<div class="bundle-name">
{{ bundle_component.product.title }}
</div>
<div class="bundle-price">
{% if bundle_component.is_free %}
В подарок
{% else %}
{{ bundle_component.quantity }} × {{ bundle_component.product.sale_price | money }}
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% if product.bundle_discount > 0 %}
<div class="bundle-discount">
Экономия: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
{% if product.is_bundle %}
<div class="bundle">
<div class="bundle-title">
Состав комплекта:
</div>
<div class="bundle-list">
{% for bundle_component in product.bundle_components %}
<div class="bundle-item">
<div class="bundle-img">
<img src="{{ bundle_component.product.first_image.medium_url }}" />
</div>
<div class="bundle-name">
{{ bundle_component.product.title }}
</div>
<div class="bundle-price">
{% if bundle_component.is_free %}
В подарок
{% else %}
{{ bundle_component.quantity }} × {{ bundle_component.product.sale_price | money }}
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% if product.bundle_discount < 0 %}
<div class="bundle-discount">
Экономия: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
{% if product.is_bundle %}
<div class="bundle">
{% if product.bundle_discount < 0 %}
<div class="bundle-discount">
Экономия при покупке комплекта: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
<a href="{{ product.canonical_collection.url }}">
{{ product.canonical_collection.title }}
</a>
Значение типа базовой(первой) типа цены. Актуально если используются дополнительные(priceN) типы цен в разделе Настройки - Типы цен
Кол-во модификаций: {{ product.variants.size }}
{{ product.updated_at | date: '%d.%m.%y' }}
Это страница отзывов?
{% if account.order_line_comments_enabled %}
<input type="text" name="comment" value="">
{% endif %}
Массив ссылок на видео
{% for video in product.video_links %}
{{ video.url }}
{% endfor %}
{% if product.show_variants? %}
<div class="product-variants">
<select name="variant_id" id="variant-select">
{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title | escape }}</option>
{% endfor %}
</select>
</div>
{% else %}
<input type="hidden" name="variant_id" value="{{ product.variants.first.id }}" />
{% endif %}
Есть ли в наличии
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
<div class="variant-available">
{% if variant.available %}
{% assign variant_available = 'в наличии' %}
{% else %}
{% assign variant_available = 'нет в наличии' %}
{% endif %}
Наличие: {{ variant_available }}
</div>
</div>
{% endfor %}
</div>
</div>
Вес модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
{% if variant.weight %}
<div class="variant-old_price">
Вес модификации: {{ variant.weight }} {{ product.unit }}
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
Название модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
<div class="variant-available">
{% if variant.available %}
{% assign variant_available = 'в наличии' %}
{% else %}
{% assign variant_available = 'нет в наличии' %}
{% endif %}
Наличие: {{ variant_available }}
</div>
<div class="variant-quantity">
{% if variant.quantity %}
{% assign variant_quantity = variant.quantity %}
{% else %}
{% assign variant_quantity = 'много' %}
{% endif %}
Остаток: {{ variant_quantity }}
</div>
{% if variant.sku %}
<div class="variant-sku">
Артикул: {{ variant.sku }}
</div>
{% endif %}
{% if variant.barcode %}
<div class="variant-barcode">
Штрих-код: {{ variant.barcode }}
</div>
{% endif %}
<div class="variant-price">
Цена модификации: {{ variant.price | money }}
</div>
{% if variant.old_price %}
<div class="variant-old_price">
Старая цена модификации: {{ variant.old_price | money }}
</div>
{% endif %}
{% if variant.weight %}
<div class="variant-old_price">
Вес модификации: {{ variant.weight }} {{ product.unit }}
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
Цена модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
<div class="variant-price">
Цена модификации: {{ variant.price | money }}
</div>
</div>
{% endfor %}
</div>
</div>
Цена закупки
Массив значений свойств товара, характеризующих данную модификацию.
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-option_values">
{% for variant in product.variants %}
<div>
Модификация: {{ variant.title }}
</div>
<div>
Свойства модификации:
</div>
{% for option_value in variant.option_values %}
<div>
{{ option_value.option_name.title }}: {{ option_value.title }}
</div>
{% endfor %}
{% endfor %}
</div>
</div>
Старая цена модификации.
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
{% if variant.old_price %}
<div class="variant-old_price">
Старая цена модификации: {{ variant.old_price | money }}
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
Штрих-код модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
{% if variant.barcode %}
<div class="variant-barcode">
Штрих-код: {{ variant.barcode }}
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
Остатки модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
<div class="variant-quantity">
{% if variant.quantity %}
{% assign variant_quantity = variant.quantity %}
{% else %}
{% assign variant_quantity = 'много' %}
{% endif %}
Остаток: {{ variant_quantity }}
</div>
</div>
{% endfor %}
</div>
</div>
Артикул модификации
<div class="variants">
<div class="variants-title">
Модификации товара:
</div>
<div class="variants-list">
{% for variant in product.variants %}
<div class="variant">
<div class="variant-title">
Имя модификации: {{ variant.title }}
</div>
{% if variant.sku %}
<div class="variant-sku">
Артикул: {{ variant.sku }}
</div>
{% endif %}
</div>
{% endfor %}
</div>
</div>
Ссылка на первое изображение варианта:
{{ variant.first_image.medium_url }}
Остатки на складе
Возвращает остатки в таком виде:
{"Москва": 10, "Санкт-Петербург": 105}
Возвращает дополнительные поля варианта в формате пермалинк:значение. Например, есть поле "Название книги", с пермалинком - "book" и со значением для конкретного варианта "Как увеличить продажи в интернете"
{{ variant.fields.book.value }},{{ variant.fields.book.title }}
>> "Как увеличить продажи в интернете","Название книги"
Типы цен варианта продукта.
{% for variant in product.variants %}
{% for item in variant.variant_price_kinds %}
title : {{ item.title }}
price_handle: {{ item.price_handle }}
price: {{ item.price }}
prcie_rules :{{ item.price_rules }}
show: {{ item.show_in_lists }}
{% endfor %}
{% endfor %}
Габариты варианта
{{variant.dimensions.width}}x{{variant.dimensions.depth}}x{{variant.dimensions.height}}
{% for property in product.properties %}
{{property.name}}: {% for item in property.characteristics %}{{item.name}},{% endfor%}
{% endfor %}
Так же можно обращаться к параметру напрямую, зная его пермалинк (handle):
{{ product.properties.handle.characteristics.first.name }}
{% for property in product.properties %}
{{ property.name }}: {% for characteristic in property.characteristics %}{{ characteristic.name }},{% endfor%}
{% endfor %}
Так же можно обращаться к параметру напрямую, зная его пермалинк (handle):
{% if product.properties.handle.characteristics.size > 0 %}
{% for characteristic in product.properties.handle.characteristics %}
{{ characteristic.name }}
{% endfor %}
{% endif %}
Обращение к параметру зная его пермалинк (handle):
{% if product.properties.handle.characteristics.size > 0 %}
{% for characteristic in product.properties.handle.characteristics %}
{{ characteristic.name }}
{% endfor %}
{% endif %}
{% for property in product.properties %}
<div>
{{ property.name }}: {% for characteristic in property.characteristics %}{{ characteristic.name }},{% endfor %}
</div>
{% endfor %}
Применение characteristic.handle на примере вывода стикеров через параметры. В нашем случае handle характеристики стикер — stiker.
Из characteristic.handle мы формируем уникальные css классы, чтобы каждому стикеру сделать свой стиль.
{% assign labels_list = '' %}
{% if product.properties.stiker %}
{% for characteristic in product.properties.stiker.characteristics %}
{% assign labels_list = labels_list | append: '<div class="stiker stiker-'| append: characteristic.handle | append: '">' | append: characteristic.title | append: '</div>' %}
{% endfor %}
{% endif %}
<div class="product">
{{ labels_list }}
<div class="product-title">
{{ product.title }}
</div>
</div>
Параметр, которому принадлежит данная характеристика.
{% for property in product.properties %}
{% for characteristic in property.characteristics %}
{{ characteristic.property.name }} / {{ characteristic.property.handle }} / {{ characteristic.property.characteristics.size }}
{% endfor %}
{% endfor %}
URL для фильтрации товаров по данной характеристике в текущей коллекции. (Доступно только в коллекции)
{% for property in collection.properties %}
<div class="property">
<div class="property-title">
{{ property.title }}
</div>
<div class="property-characteristics">
{% for characteristic in property.characteristics %}
<div class="characteristic {% if characteristic.current? %}is-checked{% endif %}">
<a href="{{ characteristic.url }}">
{{ characteristic.title }} ({{characteristic.products_count}})
</a>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
Число товаров с данной характеристикой в текущей коллекции. (Доступно только в коллекции)
{% for property in collection.properties %}
<div class="property">
<div class="property-title">
{{ property.title }}
</div>
<div class="property-characteristics">
{% for characteristic in property.characteristics %}
<div class="characteristic {% if characteristic.current? %}is-checked{% endif %}">
<a href="{{ characteristic.url }}">
{{ characteristic.title }} ({{characteristic.products_count}})
</a>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
{% for property in collection.properties %}
<div class="property">
<div class="property-title">
{{ property.title }}
</div>
<div class="property-characteristics">
{% for characteristic in property.characteristics %}
<div class="characteristic {% if characteristic.current? %}is-checked{% endif %}">
<a href="{{ characteristic.url }}">
{{ characteristic.title }} ({{characteristic.products_count}})
</a>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
{%for option_name in product.options %}
<div>
Имя свойства: {{ option_name.title }}
</div>
<div>
ID свойства: {{ option_name.id }}
</div>
{%endfor%}
Значения свойства.
{%for option_name in product.options %}
{{ option_name.title }} : {% for option_value in option_name.values %}{{ option_value.title }}{% unless forloop.last %},{% endunless %} {% endfor %}
{%endfor%}
{%for option_name in product.options %}
<div>
Имя свойства: {{ option_name.title }}
</div>
<div>
Кол-во значений свойства: {{ option_name.values.size }}
</div>
{%endfor%}
{%for option_name in product.options %}
{% for option_value in option_name.values %}
{{ option_value.title }} / {{ option_value.id }}
{% endfor %}
{%endfor%}
Название значения свойства.
<div class="options">
{% for option_name in product.options %}
<div class="option">
<div class="option-title">
{{ option_name.title }}
</div>
<div class="option-values">
{% for option_value in option_name.values %}
<div class="option-value">
{{ option_value.title }}
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
Свойства товара, значением которого является данное значение.
{%for option_name in product.options %}
{% for option_value in option_name.values %}
{{ option_value.option_name.title }} / {{ option_value.option_name.id }} / {{ option_value.option_name.values.size }}
{% endfor %}
{%endfor%}
{% for option in collection.options %}
<div class="option">
<div class="option-title">
{{ option.title }}
</div>
<div class="option-values">
{% for option_value in option.values %}
<div class="option-value {% if option_value.selected %}is-selected{% endif %}">
{{ option_value.title }}
</div>
{% endfor %}
</div>
</div>
{% endfor %}
{% for option in collection.options %}
<div class="option">
<div class="option-title">
{{ option.title }}
</div>
<div class="option-values">
{% for option_value in option.values %}
<div class="option-value {% if option_value.selected %}is-selected{% endif %}">
{{ option_value.title }} ({{ option_value.products_count }})
</div>
{% endfor %}
</div>
</div>
{% endfor %}
Имя автора отзыва
{% if account.reviews_enabled? %}
{% if product.reviews == empty %}
<div class="notice notice--info">
Пока нет отзывов
</div>
{% else %}
<ul class="reviews-list">
{% for review in product.reviews %}
<li class="review">
<div class="review-details">
<span class="review-name">{{ review.author }}</span> {{ review.created_at | date: "%d.%m.%Y %H:%M" }}
</div>
<div class="review-content">
{{ review.content | newline_to_br }}
</div>
{% if review.rating %}
<div class="review-rating rating">
Оценка: {{ review.rating }}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
урл используемый для отправки post запроса на создание отзыва.
<div id="review_form" class="review_form">
<form action="{{ review.action_url }}" method="post">
<h3>Оставить отзыв</h3>
{% if form.posted_successfully? %}
{% if account.reviews_moderated? %}
<div class="review_form-notice notice notice--success">
Отзыв успешно отправлен.<br />
Он будет промодерирован владельцем магазина перед публикацией.
</div>
{% else %}
<div class="review_form-notice notice notice--success">Отзыв добавлен.</div>
{% endif %}
{% endif %}
{% if review.errors.size > 0 %}
<div class="review_form-notice notice notice--warning">
Не все поля заполнены правильно!
</div>
{% endif %}
<div class="notice notice--info">
Все поля обязательны к заполнению
</div>
<div class="review_form-input input input--required
{% if review.errors contains 'author' %} input--error{% endif %}"
>
<label for="review_author" class="input-label">
Имя
</label>
<input type="text"
name="review[author]"
value="{{ review.author }}"
class="input-field"
/>
</div>
<div class="review_form-input input input--required
{% if review.errors contains 'email' %} input--error{% endif %}"
>
<label for="review_email" class="input-label">
E-mail (на сайте не публикуется)
</label>
<input type="email"
name="review[email]"
value="{{ review.email }}"
class="input-field"
/>
</div>
<div class="review_form-input input input--required
{% if review.errors contains 'content' %} input--error{% endif %}"
>
<label for="review_body" class="input-label">
Отзыв
</label>
<textarea name="review[content]"
rows="4"
class="input-field"
>{{ review.content }}</textarea>
<span class="input-notice notice notice--warning">
нам интересно Ваше мнение о товаре
</span>
</div>
<div class="review_form-input rating_wrapper">
<label for="rating" class="rating-label">Оцените товар:</label>
<select class="js-rating" name="review[rating]">
<option value=""></option>
{% for i in (1..5) %}
<option value="{{ i }}">{{ i }}</option>
{% endfor %}
</select>
</div>
{% if review.captcha_enabled? %}
<div id="captcha"
class="review_form-input input input--captcha input--required
{% if review.errors contains 'captcha_solution' %} input--error{% endif %}"
>
<label class="input-label">
Наберите текст, изображённый на картинке
</label>
<div id="captcha_challenge" class="input-captcha">
{{ review | captcha_challenge }}
</div>
<input type="text"
name="review[captcha_solution]"
class="input-field"
/>
</div>
{% endif %}
{% if account.reviews_moderated? %}
<div class="notice notice--info">
Перед публикацией отзывы проходят модерацию
</div>
{% endif %}
<input type="submit"
class="review_form-submit button"
value="Отправить отзыв"
/>
</form>
</div>
Дата создания отзыва.
{% for review in product.reviews %}
{{ review.created_at | date: "%d.%m.%Y %H:%M" }}
{% endfor %}
{% for review in product.reviews %}
{{ review.email }}
{% endfor %}
Список имен неправильно заполненных полей.
{{ review.errors }}
>> captcha_solutionemail
{% for error in review.errors %}
{{ error }}
{% endfor %}
>> captcha_solution
>> email
Оценка товара, поставленная в отзыве.
{% for review in product.reviews %}
{% assign r = 5 %}
{% for i in (1..5) %}
<span class="star-item {% if review.rating == r %}active{% endif %}"></span>
{% assign r = r | minus: 1 %}
{% endfor %}
{% endfor %}
{% ifaccount.reviews_enabled? %}
{% if product.reviews == empty %}
<div class="notice notice--info">
Пока нет отзывов
</div>
{% else %}
<ul class="reviews-list">
{% for review in product.reviews %}
<li class="review">
<div class="review-details">
<span class="review-name">{{ review.author }}</span> {{ review.created_at | date: "%d.%m.%Y %H:%M" }}
</div>
<div class="review-content">
{{ review.content | newline_to_br }}
</div>
{% if review.rating %}
<div class="review-rating rating">
Оценка: {{ review.rating }}
</div>
{% endif %}
</li>
{% endfor %}
</ul>
{% endif %}
{% endif %}
{% for review in product.reviews %}
<div class="reviews-item">
<div class="review-header">
<div class="author">{{ review.author }}</div>
<div class="date">{{ review.created_at | date: "%d.%m.%Y %H:%M" }}</div>
</div>
<div class="review-body">
<div class="text">
{{ review.content }}
</div>
{% if review.replied? %}
<div class="review-manager_reply">
{{ review.manager_reply }}
</div>
<div class="review-replied_at">
{{ review.replied_at | date: "%d.%m.%Y %H:%M" }}
</div>
{% endif %}
</div>
</div>
{% endfor %}
Картинка к отзыву.
В настройках отзывов нужно включить чекбокс - Включить картинки в отзывах.
{% for review in product.reviews %}
<img src="{{ review.image.medium_url }}">
{% endfor %}
{% if product.is_bundle %}
<div class="bundle">
<div class="bundle-title">
Состав комплекта:
</div>
<div class="bundle-list">
{% for bundle_component in product.bundle_components %}
<div class="bundle-item">
<div class="bundle-img">
<img src="{{ bundle_component.product.first_image.medium_url }}" />
</div>
<div class="bundle-name">
{{ bundle_component.product.title }}
</div>
<div class="bundle-price">
{% if bundle_component.is_free %}
В подарок
{% else %}
{{ bundle_component.quantity }} × {{ bundle_component.product.sale_price | money }}
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% if product.bundle_discount < 0 %}
<div class="bundle-discount">
Экономия: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
{% if product.is_bundle %}
<div class="bundle">
<div class="bundle-title">
Состав комплекта:
</div>
<div class="bundle-list">
{% for bundle_component in product.bundle_components %}
<div class="bundle-item">
<div class="bundle-img">
<img src="{{ bundle_component.product.first_image.medium_url }}" />
</div>
<div class="bundle-name">
{{ bundle_component.product.title }}
</div>
<div class="bundle-price">
{% if bundle_component.is_free %}
В подарок
{% else %}
{{ bundle_component.quantity }} × {{ bundle_component.product.sale_price | money }}
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% if product.bundle_discount < 0 %}
<div class="bundle-discount">
Экономия: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
{% if product.is_bundle %}
<div class="bundle">
<div class="bundle-title">
Состав комплекта:
</div>
<div class="bundle-list">
{% for bundle_component in product.bundle_components %}
<div class="bundle-item">
<div class="bundle-img">
<img src="{{ bundle_component.product.first_image.medium_url }}" />
</div>
<div class="bundle-name">
{{ bundle_component.product.title }}
</div>
<div class="bundle-price">
{% if bundle_component.is_free %}
В подарок
{% else %}
{{ bundle_component.quantity }} × {{ bundle_component.product.sale_price | money }}
{% endif %}
</div>
</div>
{% endfor %}
</div>
{% if product.bundle_discount < 0 %}
<div class="bundle-discount">
Экономия: {{ product.bundle_discount | money }}
</div>
{% endif %}
</div>
{% endif %}
У block_lists.handle есть два свойства:
{% for block_list in block_lists %}
Id панели блоков: {{ block_list.id }} <br>
{% endfor %}
{% for block_list in block_lists %}
Id панели блоков: {{ block_list.id }} <br>
{% for block in block_list.blocks %}
Имя блока: {{ block.title }}
{% endfor %}
{% endfor %}
Обращение к панели блоков через идентификатор:
{% for block in block_lists.handle.blocks %}
Имя блока: {{ block.title }}
Контент блока: {{ block.content }}
{% endfor %}
{% for block in block_lists.handle.blocks %}
<div class="block">
<div>
{{ block.title }}
</div>
<div>
{{ block.content }}
</div>
</div>
{% endfor %}
block_lists.with_template['handle_template'].handle_block_lists.blocks
handle_template — пермалинк шаблона блока
handle_block_lists — пермалинк панели блоков
Для доступа к панелям блоков без типа работает старый синтаксис:
block_lists.slider.blocks
При таком способе обращения к панелям блоков сначала ищется панель с названием slider среди панелей без шаблона и только потом среди остальных
{% for block in block_lists.with_template['handle_template'].handle_block_lists.blocks %}
Имя блока: {{ block.title }}
Контент блока: {{ block.content }}
{% endfor %}
Дата обновления блок-листа. Необходимо для кеширования в liquid
Пример можно увидеть в виджете - system_widget_v4_special_categories_1
{% capture cache_block_list_key %}cache_block_list_key_ci4_{{ data.id }}_{{ data.updated_at }}_{{ collections.last_updated_at }}_{{ language.locale }}{% endcapture %}
{% cache cache_block_list_key %}
{% for block in data.blocks %}
{% if block.collection %}
...
{% endif %}
{% endfor %}
{% endcache %}
{{blocks.advertising.title}}
{{blocks.advertising.content}}
blocks.with_template['handle_template'].handle_block
handle_template - пермалинк шаблона блока
handle_block - пермалинк блока
Для доступа к блокам так же работает старый синтаксис:
blocks.handle.content
Но если блоков с одинаковым permalink больше одного, то выберется последний созданый
{% assign main_block = blocks.with_template['handle_template'].handle_block %}
Имя блока: {{ main_block.title }}
system-title-and-content
Описание | Имя переменной |
Заголовок | title |
Содержание | content |
{% for block inblock_lists.with_template['handle_template'].handle_block_lists.blocks %}
Имя блока: {{ block.title }}
Контент блока: {{ block.content }}
{% endfor %}
system-banner
Описание | Имя переменной | Тип переменной | ||||||||
Заголовок | title | Текст | ||||||||
Название | name | Текст | ||||||||
Картинка | image | Файл | ||||||||
Пропорции | ratio |
Выпадающий список
|
||||||||
Ссылка | link | Текст |
system-benefit
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Описание | description | Текст |
Картинка | image | Файл |
system-collection
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Коллекция | collection | Категория |
system-collection-list
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Список категорий | collections | Список категорий |
system-widget-feedback
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Текст на кнопке | submit-text | Текст |
system-review
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Скрыть картинку? | hide_image | Чекбокс |
Текст | content | HTML |
Имя | name | Текст |
Позиция картинки | image_position | Выпадающий список |
Картинка | image | Файл |
system-social
Описание | Имя переменной | Тип переменной |
Заголовок | title | Текст |
Ссылка | link | Текст |
system-promo-slide
Описание | Имя переменной | Тип переменной |
Описание | description | Текст |
Ссылка | link | Текст |
Картинка | image | Файл |
Переменные доступные в шаблоне collection.liquid
<h1>
{{ collection.title }}
</h1>
URL коллекции
<ul class="menu is-collection">
{% for collection in collections.all.subcollections %}
<li class="menu-item">
<a href="{{ collection.url }}" class="menu-link {% if collection.current? %}is-current{% endif %}">
{{ collection.title }}
</a>
</li>
{% endfor %}
</ul>
{% if collection.id == 4223326 %}
// ваш код
{% endif %}
{% assign collection_title = 'бренды' %}
{% for current_collection in collection.current_collections %}
{% assign inner_title = current_collection.title | downcase %}
{% if inner_title contains collection_title %}
Данная категория является подкатегорией категории «бренды»
{% endif %}
{% endfor %}
<ul class="menu is-collection">
{% for collection in collections.all.subcollectons %}
<li class="menu-item">
<a href="{{ collection.url }}" class="menu-link {% if collection.current? %}is-current{% endif %}">
{{ collection.title }}
</a>
</li>
{% endfor %}
</ul>
{% for option in collection.current_option_values %}
{{ option.title }}
{% endfor %}
{% if collection.description %}
<div class="collection-description">
{{ collection.description }}
</div>
{% endif %}
Вывести конкретное доп. поле:
{% if collection.fields.banner.value %}
{{ collection.fields.banner.title }}
{{ collection.fields.banner.value }}
{% endif %}
Вывести все доп. поля:
{% for collection_field in collection.fields %}
<div class="field-title is-{{ collection_field.handle }}">
{{ collection_field.title }}
</div>
<div class="field-value">
{{ collection_field.value }}
</div>
{% endfor %}
Пермалинк категории: {{ collection.handle }}
Возможные размеры:
48x48 small_url
100x100 thumb_url
160x160 compact_url
240x240 medium_url
480x480 large_url
original image original_url
<img src="{{ collection.image.large_url }}" alt="{{ collection.title }}" />
Категория находится на {{ collection.level }} уровне
{% if collection.meta_description %}
Meta description:{{ collection.meta_description }}
{% endif %}
{% if collection.meta_keywords %}
Meta keywords страницы категории: {{ collection.meta_keywords }}
{% endif %}
{% for option in collection.options %}
<ul>
<li>
{{ option.title }}
{% if option.values.size > 0 %}
<ul>
{% for option_value in option.values %}
<li>
{{ option_value.title }}
</li>
{% endfor %}
</ul>
{% endif %}
</li>
</ul>
{% endfor %}
{% if collection.parent %}
Родительская категория: {{ collection.parent.title }}
{% else %}
Нет родительских категорий
{% endif %}
{% if collection.products.size > 1 %}
<div class="prods-paginate">
<a href="{% if collection.previous_product.url %}{{ collection.previous_product.url }}
{% else %}
{{ collection.products.last.url }}{% endif %}" class="fl"><span class="prev">⟨</span>предыдущий товар</a>
<a href="{% if collection.next_product.url %}{{ collection.next_product.url }}
{% else %}
{{ collection.products.first.url }}{% endif %}" class="fr">следующий товар<span class="next">⟩</span></a>
</div>
{% endif %}
{% if collection.products.size > 1 %}
<div class="prods-paginate">
<a href="{% if collection.previous_product.url %}{{ collection.previous_product.url }}
{% else %}
{{ collection.products.last.url }}{% endif %}" class="fl"><span class="prev">⟨</span>предыдущий товар</a>
<a href="{% if collection.next_product.url %}{{ collection.next_product.url }}
{% else %}
{{ collection.products.first.url }}{% endif %}" class="fr">следующий товар<span class="next">⟩</span></a>
</div>
{% endif %}
{% for product in collection.products %}
<a href="{{ product.url }}">{{ product.title }}</a>
{% endfor %}
{% if collection.products_count > 0 %}
Товаров в категории: {{ collection.products_count }}
{% else %}
Простите, в данном разделе пока нет товаров. Мы работаем над этим.
{% endif %}
{% for characteristic in collection.current_characteristics %}
{{ characteristic.title }}
{% endfor %}
{% if collection.seo_description %}
<div class="collection-seo_description">
{{ collection.seo_description }}
</div>
{% endif %}
{% for property in collection.properties %}
<div>
{{ property.name }}
</div>
{% for characteristic in property.characteristics %}
<div>
{{ characteristic.name }}
</div>
{% endfor %}
{% endfor %}
Также можно обратится к параметру по пермалинку (handle)
{% for characteristic in collection.properties.handle.characteristics %}
<div>
{{ characteristic.name }}
</div>
{% endfor %}
{% for collection in collection.subcollections %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
{% endfor %}
{% for collection in current_collections %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
{% endfor %}
Примеры: Вывод всех категорий верхнего уровня:
{% for collection in collections %}
{{ collection.title }}
{% endfor %}
{% assign collection_handle = 'all' %}
Следующие вызовы вернут одинаковое значение:
collections[collection_handle].title
collections['all'].title
collections.all.title
Пример использования в цикле:
{% for collection in collections.all.subcollections %}
{{ collection.title }}
{% endfor %}
{% for collection in collections.flatten %}
{% if collection.first? %}<ul>{% endif %}
{% if collection.show? %}
<li {% if collection.current? %}class="active"{% endif %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
</li>
{% endif %}
{% if collection.last? %} {% for i in (1..collection.level_difference) %}</ul>{% endfor %} {% endif %}
{% endfor %}
{% for collection in collections.flatten %}
{% if collection.first? %}<ul>{% endif %}
{% if collection.show? %}
<li {% if collection.current? %}class="active"{% endif %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
</li>
{% endif %}
{% if collection.last? %} {% for i in (1..collection.level_difference) %}</ul>{% endfor %} {% endif %}
{% endfor %}
{% for collection in collections.flatten %}
{% if collection.first? %}<ul>{% endif %}
{% if collection.show? %}
<li {% if collection.current? %}class="active"{% endif %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
</li>
{% endif %}
{% if collection.last? %} {% for i in (1..collection.level_difference) %}</ul>{% endfor %} {% endif %}
{% endfor %}
{% for collection in collections.flatten %}
{% if collection.first? %}<ul>{% endif %}
{% if collection.show? %}
<li {% if collection.current? %}class="active"{% endif %}
<a href="{{ collection.url }}">{{ collection.title }}</a>
</li>
{% endif %}
{% if collection.last? %} {% for i in (1..collection.level_difference) %}</ul>{% endfor %} {% endif %}
{% endfor %}
Возвращает разницу уровней между текущей и предыдущей категорией, по сути число означает сколько закрывающих тегов надо вывести при отображении дерева.
Вывод дерева категорий (с использованием объекта collections.flatten - полный список категорий магазина, всех уровней вложенности):
{% for collection in collections.flatten %}
{% if collection.first? %}<ul>{% endif %}
{% if collection.show? %}
<li {% if collection.current? %}class="active"{% endif %}>
<a href="{{ collection.url }}">{{ collection.title }}</a>
</li>
{% endif %}
{% if collection.last? %} {% for i in (1..collection.level_difference) %}</ul>{% endfor %} {% endif %}
{% endfor %}
{% for seo_filter in collection.filters %}
<a href="{{ collection.url }}/{{ seo_filter.handle }}" class="{% if filter.handle == seo_filter.handle %}is-active{% endif %}">
{{ seo_filter.title }}
</a>
{% endfor %}
{% if collection.subcollections.size > 0 %}
...
{% endif %}
Корневая категория
{{ collections.root_category.handle }}
{% if filter %}
<div class="filter-description">
{{ filter.description }}
</div>
{% endif %}
{% if filter %}
<div class="filter-description filter-{{ filter.handle }}">
{{ filter.description }}
</div>
{% endif %}
{% if filter %}
<div class="filter-description filter-{{ filter.handle }}">
ID seo фильтра - {{ filter.id }}
</div>
{% endif %}
{% if filter.meta_description %}
Meta description seo фильтра: {{ filter.meta_description }}
{% endif %}
{% if filter.meta_keywords %}
Meta keywords seo фильтра: {{ filter.meta_keywords }}
{% endif %}
{% if filter %}
<h1>{{ filter.title }}</h1>
{% else %}
<h1>{{ collection.title }}</h1>
{% endif %}
{% if filter %}
<div class="filter-seo_description">
{{ filter.seo_description}}
</div>
{% endif %}
{% for field in filter.fields %}
{{ field.title }}<br>
{{ field.handle }}<br>
{{ field.value }}
{% endfor %}
Объект cart доступен во всех шаблонах темы.
{% if cart.enable_coupon? %}
<form action="{{ cart_url }}" method="post" >
<input type="text" name="cart[coupon]" value="{{ cart.coupon }}" placeholder="Введите купон">
<button type="submit">
Применить купон
</button>
{% if cart.invalid_coupon? %}
<div class="discounts-notice notice notice-error">
{{ cart.coupon_error }}
</div>
{% endif %}
{% if cart.discounts.size > 0 %}
{% for discount in cart.discounts %}
<div class="discount">
<div class="discount-title">
{{ discount.description }}
</div>
<div class="discount-prices prices">
<span class="prices-current">
- {{ discount.amount | money }}
</span>
</div>
</div>
{% endfor %}
{% endif %}
</form>
{% endif %}
{% if cart.enable_coupon? %}
<form action="{{ cart_url }}" method="post" >
<input type="text" name="cart[coupon]" value="{{ cart.coupon }}" placeholder="Введите купон">
<button type="submit">
Применить купон
</button>
{% if cart.invalid_coupon? %}
<div class="discounts-notice notice notice-error">
{{ cart.coupon_error }}
</div>
{% endif %}
{% if cart.discounts.size > 0 %}
{% for discount in cart.discounts %}
<div class="discount">
<div class="discount-title">
{{ discount.description }}
</div>
<div class="discount-prices prices">
<span class="prices-current">
- {{ discount.amount | money }}
</span>
</div>
</div>
{% endfor %}
{% endif %}
</form>
{% endif %}
{% if cart.discounts.size > 0 %}
{% for discount in cart.discounts %}
<div class="discount">
<div class="discount-title">
{{ discount.description }}
</div>
<div class="discount-prices prices">
<span class="prices-current">
- {{ discount.amount | money }}
</span>
</div>
</div>
{% endfor %}
{% endif %}
{% if cart.enable_coupon? %}
<form action="{{ cart_url }}" method="post" >
<input type="text" name="cart[coupon]" value="{{ cart.coupon }}" placeholder="Введите купон">
<button type="submit">
Применить купон
</button>
{% if cart.invalid_coupon? %}
<div class="discounts-notice notice notice-error">
{{ cart.coupon_error }}
</div>
{% endif %}
{% if cart.discounts.size > 0 %}
{% for discount in cart.discounts %}
<div class="discount">
<div class="discount-title">
{{ discount.description }}
</div>
<div class="discount-prices prices">
<span class="prices-current">
- {{ discount.amount | money }}
</span>
</div>
</div>
{% endfor %}
{% endif %}
</form>
{% endif %}
{% if cart.enable_coupon? %}
<form action="{{ cart_url }}" method="post" >
<input type="text" name="cart[coupon]" value="{{ cart.coupon }}" placeholder="Введите купон">
<button type="submit">
Применить купон
</button>
{% if cart.invalid_coupon? %}
<div class="discounts-notice notice notice-error">
{{ cart.coupon_error }}
</div>
{% endif %}
{% if cart.discounts.size > 0 %}
{% for discount in cart.discounts %}
<div class="discount">
<div class="discount-title">
{{ discount.description }}
</div>
<div class="discount-prices prices">
<span class="prices-current">
- {{ discount.amount | money }}
</span>
</div>
</div>
{% endfor %}
{% endif %}
</form>
{% endif %}
{% for item in cart.items %}
<div class="item">
<div class="item-title">
{{ item.title }}
</div>
<div class="item-title">
{{ item.quantity | money }} × {{ item.sale_price }} = {{ item.total_price | money }}
</div>
</div>
{% endfor %}
Товаров в корзине: {{ cart.items_count }}
Итого: {{ cart.items_price | money }}
{% if cart.items_weight %}
Сумарный вес товаров в корзине: {{ cart.items_weight }}
{% endif %}
Суммарная стоимость заказа с учетом доставки: {{ cart.total_price | money }}
Для работы данного функционала нужно включить настройку в бэк-офисе: Настройки -> Карточка магазина -> Включить комментарии к позициям заказа
<!-- Вывод комментария в корзине -->
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
<div class="item-comment">
<!-- изменить комментарий в корзине -->
<input type="text" name="cart[order_line_comments][{{ item.id }}]" value="{{ item.comment }}" />
<!-- Просто вывести комментарий -->
<span>
{{ item.comment }}
</span>
</div>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
<!-- Форма добавления товара с комментарием -->
<form action="{{ cart_url }}" method="post" data-product-id="{{ product.id }}">
{% if product.show_variants? %}
<select name="variant_id" data-product-variants>
{% for variant in product.variants %}
<option value="{{ variant.id }}">{{ variant.title | escape }}</option>
{% endfor %}
</select>
{% else %}
<input type="hidden" name="variant_id" value="{{product.variants.first.id}}" >
{% endif %}
<!-- Комментарий к позиции заказа. -->
<input type="text" name="comment" value="">
<div data-quantity>
<input type="text" name="quantity" value="1" />
<span data-quantity-change="-1">-</span>
<span data-quantity-change="1">+</span>
</div>
<button type="submit" data-item-add>
Добавить в корзину
</button>
</form>
Активно используется в атрибутах name полей формы корзины.
Например:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" />
<input type="text" name="cart[order_line_comments][{{ item.id }}]" value="{{ item.comment }}" />
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
{% if item.weight %}
<div class="item-weight">
Вес товара: {{ item.weight }} {{ item.unit }}
</div>
<div class="item-weight">
Суммарный вес товаров позиции: {{ item.total_weight }} {{ item.unit }}
</div>
{% endif %}
<div class="item-quantity">
Изменить количество товаров позиции:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" class="item-quantity-input">
</div>
<a href="{{ item.url }}" data-item-target="{{ item.id }}" class="item-remove js-item-remove">
Удалить
</a>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
<!-- jQuery скрипт удаления -->
<script type="text/javascript">
$(document).ready(function() {
$('.js-item-remove').click(function(event) {
event.preventDefault();
var itemUrl = $(this).attr('href');
var removeUrl = itemUrl + '.json';
var _targetId = $(this).data('item-target');
var $itemBlock = $('[data-item-block="'+ _targetId +'"]')
$.ajax({
url: itemUrl,
type: 'POST',
data: { _method: 'delete'}
})
.done(function() {
console.log("Товар успешно удален");
$itemBlock.remove();
})
.fail(function() {
console.log("Что то пошло не так");
})
});
});
</script>
{% for item in cart.items %}
<div class="cart-item">
<div class="item-image">
<a class="item-image-link" href="{{item.product.url}}?variant_id={{item.variant.id}}">
<img src="{{ item.product.first_image.medium_url }}">
</a>
</div>
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
</div>
{% endfor %}
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
<div class="item-quantity">
Изменить количество товаров позиции:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" class="item-quantity-input">
</div>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
<div class="item-price">
{{ item.sale_price | money }} × {{ item.quantity }} = {{ item.total_price | money }}
</div>
</div>
{% endfor %}
Если у товара позиции есть модификация, помимо имени товара, в скобках через слеш будет выведена информация о модификации.
Например: Футболка (Белая / XL)
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.title }}
</a>
</div>
{% endfor %}
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
<div class="item-price">
{{ item.sale_price | money }} × {{ item.quantity }} = {{ item.total_price | money }}
</div>
</div>
{% endfor %}
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
{% if item.weight %}
<div class="item-weight">
Вес товара: {{ item.weight }} {{ item.unit }}
</div>
<div class="item-weight">
Суммарный вес товаров позиции: {{ item.total_weight }} {{ item.unit }}
</div>
{% endif %}
<div class="item-quantity">
Изменить количество товаров позиции:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" class="item-quantity-input">
</div>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
{% if item.weight %}
<div class="item-weight">
Вес товара: {{ item.weight }} {{ item.unit }}
</div>
<div class="item-weight">
Суммарный вес товаров позиции: {{ item.total_weight }} {{ item.unit }}
</div>
{% endif %}
<div class="item-quantity">
Изменить количество товаров позиции:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" class="item-quantity-input">
</div>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<div class="item-image">
<a class="item-image-link" href="{{item.product.url}}?variant_id={{item.variant.id}}">
<img src="{{ item.product.first_image.medium_url }}">
</a>
</div>
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
<a href="{{ item.url }}" data-item-target="{{ item.id }}" class="item-remove js-item-remove">
Удалить
</a>
</div>
{% endfor %}
<!-- jQuery скрипт удаления -->
<script type="text/javascript">
$(document).ready(function() {
$('.js-item-remove').click(function(event) {
event.preventDefault();
var itemUrl = $(this).attr('href');
var removeUrl = itemUrl + '.json';
var _targetId = $(this).data('item-target');
var $itemBlock = $('[data-item-block="'+ _targetId +'"]')
$.ajax({
url: itemUrl,
type: 'POST',
data: { _method: 'delete'}
})
.done(function() {
console.log("Товар успешно удален");
$itemBlock.remove();
})
.fail(function() {
console.log("Что то пошло не так");
})
});
});
</script>
{% for item in cart.items %}
<div class="cart-item">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.title }}
</a>
{% if item.variant.option_values.size > 0 %}
<div class="item-option_values">
{% for option_value in item.variant.option_values %}
<div class="item-option_name">
<span>{{ option_value.option_name.title }}</span> - <span>{{ option_value.title }}</span>
</div>
{% endfor %}
</div>
{% endif %}
</div>
{% endfor %}
<form action="{{ cart_url }}" method="post">
<input type="hidden" name="_method" value="put">
<input type="hidden" name="make_order" value="">
{% for item in cart.items %}
<div class="cart-item" data-item-block="{{ item.id }}">
<a href="{{ item.product.url }}?variant_id={{ item.variant.id }}" class="item-title">
{{ item.product.title }}
</a>
{% if item.weight %}
<div class="item-weight">
Вес товара: {{ item.weight }} {{ item.unit }}
</div>
<div class="item-weight">
Суммарный вес товаров позиции: {{ item.total_weight }} {{ item.unit }}
</div>
{% endif %}
<div class="item-quantity">
Изменить количество товаров позиции:
<input type="text" name="cart[quantity][{{ item.id }}]" value="{{ item.quantity }}" class="item-quantity-input">
</div>
</div>
{% endfor %}
<input type="submit" value="Оформить">
</form>
linklists - это массив всех меню из раздела меню и страницы. К конкретному меню можно обратиться через пермалинк (linklists.main-menu).
Через пермалинк можно обращаться к массиву пуктов меню.
<ul>
{% for link in linklists.main-menu.links %}
{% assign current_class = '' %}
{% if link.current? %}
{% assign current_class = 'active' %}
{% endif %}
<li class="{{ current_class }}" >
<a href="{{ link.url }}">{{ link.title }}</a>
</li>
{% endfor %}
</ul>
Вывод имени меню с пермалинком main-menu
{{ linklists.main-menu.title }}
<ul>
{% for link in linklists.main-menu.links %}
{% assign current_class = '' %}
{% if link.current? %}
{% assign current_class = 'active' %}
{% endif %}
<li class="{{ current_class }}" >
<a href="{{ link.url }}">{{ link.title }}</a>
</li>
{% endfor %}
</ul>
<ul>
{% for link in linklists.main-menu.links %}
{% assign current_class = '' %}
{% if link.current? %}
{% assign current_class = 'active' %}
{% endif %}
<li class="{{ current_class }}" >
<a href="{{ link.url }}">{{ link.title }}</a>
</li>
{% endfor %}
</ul>
<ul>
{% for link in linklists.main-menu.links %}
{% assign current_class = '' %}
{% if link.current? %}
{% assign current_class = 'active' %}
{% endif %}
<li class="{{ current_class }}" >
<a href="{{ link.url }}">{{ link.title }}</a>
</li>
{% endfor %}
</ul>
<h1>Список статей блога {{ blog.title }}:</h1>
<ul>
{% for article in blog.articles %}
<li>
<a href="{{ article.url }}">{{ article.title }}</a>
</li>
{% endfor %}
</ul>
<!-- Если заголовки блогов ['Новости', 'Статьи'] -->
{% for blog in blogs %}
{{ blog.title }}
{% endfor %}
#=> Новости
#=> Статьи
<h1>Список блогов:</h1>
<ul>
{% for blog in blogs %}
<li>
<a href="{{ blog.url }}">
{{ blog.title }}
</a>
</li>
{% endfor %}
</ul>
<div class="tagcloud-block">
{% unless blog.tags == empty %}
<div class="tagcloud">
<div class="tagcloud-header">
<h3>Теги:</h3>
</div><!-- /.tagcloud-header -->
<ul class="tags-list list-horizontal">
{% for tag in blog.tags %}
<li class="list-item">
<a class="list-link {% if tag.current? %}is-active{% endif %}" href='{{ tag.url }}' title='{{ tag.title }}'>
{{ tag.title }}
</a>
</li>
{% endfor %}
</ul>
</div><!-- /.tags -->
{% endunless %}
</div>
<h1>Список блогов:</h1>
<ul>
{% for blog in blogs %}
<li>
<a href="{{ blog.url }}">
{{ blog.title }}
</a>
</li>
{% endfor %}
</ul>
Возможные размеры:
48x48 small_url
100x100 thumb_url
160x160 compact_url
240x240 medium_url
480x480 large_url
original image original_url
{{ article.image.large_url }}
<div class="tags-block">
{% unless article.tags == empty %}
<div class="tags">
<div class="tags-header">
<h3>Теги:</h3>
</div><!-- /.tags-header -->
<ul class="tags-list list-horizontal">
{% for tag in article.tags %}
<li class="list-item">
<a class="list-link" href='{{ tag.url }}' title='{{ tag.title }}'>
{{ tag.title }} ({{ tag.articles_count }})
</a>
</li>
{% endfor %}
</ul>
</div><!-- /.tags -->
{% endunless %}
</div>
Дата обновления статьи
Массив доступных языков
{% for language in languages %}
<a href="?lang={{language.locale}}"><img src="{{ language.icon_url }}" alt="{{ language.title }}"
title="{{ language.title }}"></a>
{% endfor %}
URL переключения языка магазина на данный язык (используется в списке языков).
Не использовать переключение языков с данной переменной, когда на body добавлен дата атрибут data-multi-lang="{{ language.not_default? }}"
Максимальное кол-во символов 204800.
{% comment %}
Делаем пермалинк страницы вручную
{% endcomment %}
{% assign page_handle = page.url | split: '/' | last %}
<div class="page-content page-{{ page_handle }}">
{{ page.content }}
</div>
{% if search.performed? %}
{% if search.results == empty %}
Измените ключевые слова для поиска:
{% else %}
Вы искали: {{ search.query }}
{% endif %}
{% else %}
Введите ключевые слова для поиска:
{% endif %}
{% if search.performed? %}
Вы искали: {{ search.query }}
{% else %}
Введите ключевые слова для поиска:
{% endif %}
Результаты поиска:
{% for product in search.results %}
<a href="{{ product.url }}">{{ product.title }}</a>
{% endfor %}
<form action="{{ search_url }}" method="get">
{% if language.not_default? %} <input type="hidden" name="lang" value="{{ language.locale }}"> {% endif %}
<input type="text" name="q" value="{{search.query | escape}}" id="left_search_field" /> <input type="submit" value="Поиск" id="left_search_button" />
</form>
Процент скидки, если задана в процентах.
<div class="order">
{% for item in order.items %}
<div class="item">
<div class="item-title">
{{ item.title }}
</div>
{% if item.sku %}
<div class="item-title">
Артикул: {{ item.sku }}
</div>
{% endif %}
<div class="item-quantity">
{{item.quantity}}
</div>
<div class="item-total_price">
{{ item.total_price | money }}
</div>
</div>
{% endfor %}
</div>
{% if order.delivery_time %}
Доставка: {{ order.delivery_time }} {{ order.delivery_date }}
{% endif %}
Поля заказа order.all_fields - массив кастомных полей заказа order.fields - массив кастомных полей заказа выводимых в корзине order.client.all_fields - массив полей клиента у заказа, включая скрытые поля клиента order.client.client_fields - массив полей клиента у заказа( не включает скрытые поля ) order.shipping_address.all_fields - массив полей адреса у заказа, включая скрытые для клиента поля адреса order.shipping_address.client_fields - массив полей адреса у заказа ( не включает скрытые поля ) order.result_fields - массив полей у заказа показываемые клиенту после оформления заказа.
Для вывода поля в корзине {{ cart.all_fields['Новое'].input }}.
{{ order.all_fields['Название поля в бэк-офисе'].value }}
{% if order.paid? %}
оплачен
{% else %}
не оплачен
{% endif %}
{% if order.payment_needed? %}
{% if order.paid_with_bank_bill? %}
<a href="{{ order.pay_url }}">Перейти к оплате (распечатать квитанцию)</a>
{% else %}
<a href="{{ order.pay_url }}">Перейти к оплате</a>
{% endif %}
{% endif %}
{% if order.payment_needed? %}
{% if order.paid_with_bank_bill? %}
<a href="{{ order.pay_url }}">Перейти к оплате (распечатать квитанцию)</a>
{% else %}
<a href="{{ order.pay_url }}">Перейти к оплате</a>
{% endif %}
{% endif %}
{% if order.payment_needed? %}
{% if order.paid_with_bank_bill? %}
<a href="{{ order.pay_url }}">Перейти к оплате (распечатать квитанцию)</a>
{% else %}
<a href="{{ order.pay_url }}">Перейти к оплате</a>
{% endif %}
{% endif %}
Статусы поумолчанию
В бэк-офисе | На сайте |
Новый (new) | Принят |
В обработке (accepted) | В обработке |
Согласован (approved) | Согласован |
Отгружен (dispatched) | В доставке |
Доставлен (delivered) | Выполнен |
Отменен (declined) | Отменен |
Возврат (returned) | Возврат |
{% capture span_class %}{% if order.fulfillment_status == 'declined' or order.fulfillment_status == 'returned' %}red{% else %}green{% endif %}{% endcapture %}
<span class='{{ span_class }}'>{{ order.customer_status }}</span>
Статусы поумолчанию
В бэк-офисе | На сайте |
Новый (new) | Принят |
В обработке (accepted) | В обработке |
Согласован (approved) | Согласован |
Отгружен (dispatched) | В доставке |
Доставлен (delivered) | Выполнен |
Отменен (declined) | Отменен |
Возврат (returned) | Возврат |
{% capture span_class %}{% if order.fulfillment_status == 'declined' or order.fulfillment_status == 'returned' %}red{% else %}green{% endif %}{% endcapture %}
<span class='{{ span_class }}'>{{ order.customer_status }}</span>
Сумма позиций заказа с учетом скидки
new - Новый
accepted - В обработке
approved - Согласован
dispatched - Отгружен
delivered - Доставлен
declined - Отменен
returned - Возврат
Комментарий продавца
Первая загрузка страницы (доступно только на странице успешного заказа order2.liquid).
Переменная полезна для отправки аналитики по заказам.
<script>
{% if order.first_time_loading_page? %}
dataLayer.push({
'ecommerce': {
'currencyCode': 'RUB',
'purchase': {
'actionField': {
id: '{{ order.id}}',
affiliation: 'Online Store',
revenue: '{{ order.total_price }}',
tax: '{{ order.tax_amount }}',
shipping: '{{ order.delivery_price }}',
coupon: '{{ order.coupon }}'
},
'products': [
{% for item in order.items %}
{% capture products_ec %}{"id":"{{item.product.id}}","name":"{{item.product.title}}","price":"{{item.variant.price}}","category":"{{item.product.canonical_collection.title}}","variant":"","quantity":{{ item.quantity }}}{% endcapture %}
{{products_ec}},
{% endfor %}
]
}
},
'event': 'gtm-ee-event',
'gtm-ee-event-category': 'Enhanced Ecommerce',
'gtm-ee-event-action': 'Purchase',
'gtm-ee-event-non-interaction': 'False',
})
{% endif %}
</script>
Перебор всех заказов, можно использовать для вывода всех заказов клиента .
<div class="orders">
{% for order in orders %}
{% for item in order.items %}
{{ item.title }}
{% if item.sku %}
Артикул: {{ item.sku }}
{% endif %}
{{item.quantity}}
{{ item.total_price | money }}
{% endfor %}
{% endfor %}
</div>
ID менеджера
Имя менеджера
E-mail менеджера
Имя группы к которой принадлежит залогиненый клиент. Список групп можно посмотреть в бэк-офисе в разделе клиенты
{% if client_group.title == 'Оптовики' %}
Контент для пользователей группы "Оптовики"
{% endif %}
Id группы можно узнать только выведя эту переменную в код и войти под пользователем включенным в нужную группу.
Если нужна проверка на вхождение клиента в определенную группу, используйте client_group.title
{% if client %}
Информация для клиентов
{% endif %}
Общее число бонусов у клиента
Возвращает массив всех частей пагинации.
{% for part in paginate.parts %}
{% if part.is_link %}
<li class="pagination-page">
<a href="{{ part.url }}"
class="pagination-node pagination-node--link"
>
{{ part.title }}
</a>
</li>
{% else %}
<li class="pagination-page">
{% if part.title == paginate['current_page'] %}
<span class="pagination-node pagination-node--block pagination-node--current">
{{ part.title }}
</span>
{% else %}
<span class="pagination-node--block">
{{ part.title }}
</span>
{% endif %}
</li>
{% endif %}
{% endfor %}
Возвращает ссылку на предыдущую страницу пагинации.
Возвращает ссылку на следущую страницу пагинации.
Возвращает количество элементов, отображаемых на одной странице.
account.delivery_variants.id - id способа доставки
account.delivery_variants.title - название способа доставки
account.delivery_variants.price - стоимость способа доставки
{% for delivery_variant in account.delivery_variants %}
<div>
Id способа доставки - {{delivery_variant.id}}
</div>
<div>
Название способа доставки - {{delivery_variant.title}}
</div>
<div>
Стоимость - {{delivery_variant.price}}
</div>
<div>
Описание - {{delivery_variant.description}}
</div>
<div>
Бесплатно при заказе от - {{delivery_variant.charge_up_to}}
</div>
{% endfor %}
account.payment_gateways.id - id способа оплаты
account.payment_gateways.title - название способа оплаты
Если коэффициент 2 и бонусный процент 10.
То за заказ на 500 рублей, будет зачислено 100 баллов (50рублей).
И если будешь оплачивать бонусами то 70бонусов / 2 = 35р.
{% if account.bonus_system %}
Бонусная система включена
{% else %}
Бонусная система отключена
{% endif %}
В форме товара:
{% if account.order_line_comments_enabled %}
<input type="text" name="comment" value="">
{% endif %}
В форме корзины
{% if account.order_line_comments_enabled %}
<input type="text" name="cart[order_line_comments][{{ item.id }}]" value="{{ item.comment }}" />
{% endif %}
Код валюты
{%- if template contains 'product' -%}
{%- assign product_description = product.description | json -%}
{%- unless product.description -%}
{%- assign product_description = product.short_description | json -%}
{%- endunless -%}
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Product",
"name": "{{ product.title }}",
"image": "{{ product.images.first.original_url }}",
"description": {{ product_description }},
"brand": "{{ product.properties.brend.characteristics.first.name }}",
"sku": "{{ product.sku }}",
"offers": {
"@type": "AggregateOffer",
"lowPrice": "{{ product.price_min }}",
"highPrice": "{{ product.price_max }}",
"priceCurrency": "{{ account.currency_code }}",
"offerCount": "{{ product.variants.size }}",
"offers": [
{%- for variant in product.variants -%}
{
"@type": "Offer",
"url": "{{ product.url }}",
"priceCurrency": "{{ account.currency_code }}",
"price": "{{ variant.price }}",
"sku": "{{ variant.id }}",
"availability": "https://schema.org/{% if variant.available %}InStock{% else %}OutOfStock{% endif %}"
}{% unless forloop.last %},{% endunless %}
{%- endfor -%}
]
}
{%- if product.rating -%},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "{{ product.rating }}",
"worstRating": "1",
"bestRating": "5",
"ratingCount": "{{ product.reviews_count }}",
"reviewCount": "{{ product.reviews_count }}"
},
"review": [
{%- for review in product.reviews -%}
{
"@type": "Review",
"name": "{{ product.title }}",
"reviewBody": "{{ review.content | escape }}",
"reviewRating": {
"@type": "Rating",
"ratingValue": "{% if review.rating %}{{ review.rating }}{% else %}5{% endif %}",
"bestRating": "5",
"worstRating": "1"
},
"datePublished": "{{ review.created_at | date: "%Y-%m-%d" }}",
"author": {"@type": "Person", "name": "{{ review.author }}"}
}{% unless forloop.last %},{% endunless %}
{%- endfor -%}
]
{%- endif -%}
}
</script>
{%- endif -%}
Значении настройки "Запретить заказывать больше, чем есть в наличии"
Минимально разрешённая сумма заказа.
Доступно переключение валюты на странице?
Валюты на сайте
Отзывы со всех товаров в магазине
<div class="reviews">
{% for item in account.reviews %}
<div class="review">
<div class="review-author">
{{ item.author }}
</div>
<div class="review-date">
{{item.created_at}}
</div>
<div class="review-content">
{{item.content}}
</div>
</div>
{% endfor %}
</div>
Отзывы со всех товаров в магазине без спама
Отзывы со всех товаров в магазине только с пометкой спам
Массив складов
ID Склада
{% for warehous in account.warehouses %}
<p>
id склада: {{ warehous.id }} <br>
Название склада: {{ warehous.title }}
</p>
{% endfor %}
Название склада
{% for warehous in account.warehouses %}
<p>
id склада: {{ warehous.id }} <br>
Название склада: {{ warehous.title }}
</p>
{% endfor %}
<img src="{{ product.first_image.large_url }}">
<img src="{{ collection.image.large_url }}">
<img src="{{ article.image.large_url }}">
{% assign string = 'wooden, deepsnow, season2006' %}
{% assign array = string | split: ', ' | reverse %}
{{ array | size }}
#=> 3
{% assign string = 'wooden, deepsnow, season2006' %}
{% assign array = string | split: ', '%}
{{ array | first }}
#=> wooden
{% assign string = 'wooden, deepsnow, season2006' %}
{% assign array = string | split: ', '%}
{{ array | last }}
#=> season2006
{% assign string = 'wooden, deepsnow, season2006' %}
{% assign array = string | split: ', '%}
{{array[0]}} #=> wooden
{% assign my_string = 'wooden, deepsnow, season2006' %}
{% assign my_array = my_string | split: ', '%}
{{ my_array | join: ', ' }}
#=> wooden, deepsnow, season2006
{% assign string = 'wooden, deepsnow, season2006' %}
{% assign array = string | split: ', ' | reverse %}
{{ array | first }}
#=> season2006
{{ array | last }}
#=> wooden
<!-- products = "a", "b", "A", "B" -->
{% assign products = collection.products | sort: 'title' %}
{% for product in products %}
{{ product.title }}
{% endfor %}
#=> A B a b
{% assign collection_titles = collections | map: 'title' %}
{% for collection_title in collection_titles %}
{{ collection_title }},
{% endfor %}
#=> каталог1,каталог2,каталог3,
{{ collections.all.products | where: "available", false | size }}
{% assign fruits = "apples, oranges, peaches, tomatoes" | split: ", " %}
{% assign vegetables = "broccoli, carrots, lettuce, tomatoes" | split: ", " %}
{% assign plants = fruits | concat: vegetables %}
=> ["apples","oranges","peaches","tomatoes","tomatoes","broccoli","carrots","lettuce","tomatoes"]
{% assign fruits = "apples, oranges, peaches, tomatoes, tomatoes" | split: ", " | uniq | json %}
=> [apples, oranges, peaches, tomatoes]
{% assign number = 2 %}
{{ number | plus: 2 }}
#=> 4
{% assign number = 2 %}
{{ number | minus: 2 }}
#=> 0
{{ 10 | times: 2 }}
#=> 20
{{ 10 | divided_by: 2 }}
#=> 5
{{ 4.6 | round: 0 }}
{{ 4.3 | round: 0 }}
{{ 4.5612 | round: 2 }}
#=> 5
#=> 4
#=> 4.56
{{ 12 | modulo: 5 }}
#=> 2
Привести строку к числу
{{ '10' | to_integer }}
=>10
{{ nil | to_integer }}
=> 0
{% assign test = '10' | to_integer %}
{% if test > 9 %}
test > 9
{% endif %}
=> test > 9
{{ 'shop.css' | asset_url }}
=> //assets3.insales.ru/assets/1/7120/23504/v_1479117076/build/shop.css
Возвращает ссылку на файл из темы. Если файла в теме нет, возвращается пустая строка.
{% assign path = "image.png" | asset_url_if_exists %}
{% if path %}
<img src="{{ path }}" />
{% else %}
Картинка отсутствует
{% endif %}
{{ 'image.png' | file_url }}
Добавить гет параметр к ссылке
{{ '/product?lang=ru' | add_param: 'variant_id', 123456 }}
=>
/product?lang=ru&variant_id=123456
Фильтр преобразует URL с учетом текущего языка
{{'/page/about' | locale_url}}
=> /page/about?lang=en
{{ product.price | money }}
#=> 1 000 руб.
{{ 1000 | money }}
#=> 1 000 руб.
{{ 'sales' | append: '.jpg' }}
#=> sales.jpg
{{ 'sale' | prepend: 'Made a great ' }}
#=> Made a great sale
{{ 'capitalize me' | capitalize }}
#=> Capitalize me
<!-- product.title = "Awesome Shoes" -->
{{ product.title | replace: 'Awesome', 'Mega' }}
#=> Mega Shoes
{{ 'i want this to be uppercase' | upcase }}
#=> I WANT THIS TO BE UPPERCASE
{{ 'UPPERCASE' | downcase }}
#=> uppercase
{{ "<p>test</p> <div class='block'></div>" | escape }}
#=> <p>test</p> <div class='block'></div>
{% capture var %}
One
Two
Three
{% endcapture %}
{{ var | newline_to_br }}
#=>
One <br>
Two<br>
Three<br>
{{ '<p>Текст в теге </br> новая строка</p>' | strip_html | truncate: 20 }}
>> Текст в теге нов...
{{ 'test md5' | md5 }}
#=> 0e4e3b2681e8931c067a23c583c878d5
{{ "Hello, world. Goodbye, world." | remove: "world" }}
#=> Hello, . Goodbye, .
{{ "Hello, world. Goodbye, world." | remove_first: "world" }}
#=> Hello, . Goodbye, world.
{{ " So much room for activities! " | lstrip }}
>> So much room for activities!
{{ "The cat came back the very next day" | truncate: 13 }}
The cat ca...
{{ "ABCDEFGHIJKLMNOPQRSTUVWXYZ" | truncate: 18, ", and so on" }}
ABCDEFG, and so on
{{ "The cat came back the very next day" | truncatewords: 4 }}
The cat came back...
{{ "The cat came back the very next day" | truncatewords: 4, "--" }}
The cat came back--
{{ "john@liquidhub.ru" | url_encode }}
=> john%40liquidhub.ru
{{ 'john%40liquidhub.ru' | url_decode }}
=> john@liquidhub.ru
{{ product_price | default: 2.99 }}
>> 2.99
{% assign product_price = "" %}
{{ product_price | default: 2.99 }}
>> 2.99
{{ 'now' | date: "%Y" }}
<script type="text/javascript">
var myObject = {
text: {{ '<p>Строка в html теге</p>' | json }},
product: {{ product | json }}
}
console.log(myObject);
</script>
<script type="text/javascript">
var customArticle = {{ article | custom_json: 'title', 'id', 'author' }};
</script>
Проверяет, темный цвет или нет. Принимает только hex.
{{ '#000000' | dark? }}
=> true
{{ '#ffffff' | dark? }}
=> false
Изменить яркость цвета
{{ '#0036b3' | change_lightness: -20 }}
=> #002270
{{ '#0036b3' | change_lightness: 0 }}
=> #0036b3
{{ '#0036b3' | change_lightness: 20 }}
=> #0049f5
Фильтр для указания размера изображения.
Фильтр на вход принимает параметр в виде числа.
Например если указать 200, то изображение уменьшится с сохранением пропорций до 200px по длинной стороне. 200x400 = > 100x200.
Минимальный размер 16px.
Максимальный размер 2048px.
У фильтра есть второй не обязательный параметр - format.
Этот параметр принимает 2 значения - 'jpg' или 'webp'.
Параметр format преобразовывает png => jpg или любой формат в webp, что позволяет оптимизировать изображение.
! Если исходное изображение по размеру меньше указанного в фильтре, изображение будет растянуто до указанно значения.
! Не применяется к ассетам темы (содержимое папки media).
Параметр resizing_type дает возможность заставить картинку изменять размер по ширине.
Для этого необходимо выставить значение fit_width
<img src="{{ product.first_image | image_url: 800, resizing_type: 'fit_width' }}">
<img src="{{ article.image | image_url: 320, format: 'jpg' }}">
<img src="{{ collection.image | image_url: 600, format: 'webp' }}">
Фильтр создает из объекта изображения тег picture, в который добавляет изображение в формате .webp, а так же тег img с исходным форматом.
Фильтр принимает обязательное значение (размер изображения) в формате числа.
Через запятую можно указать атрибуты для тега img. Если у изображения товара заполнено имя, оно проставиться в атрибут title автоматически.
! Не применяется к ассетам темы (содержимое папки media).
{% assign image_title = product.title | escape %}
{{ product.first_image | webp_picture_tag: 600, class: 'product-image', data-index: 1, alt: image_title, title: image_title }}
На выходе получаем =>
<picture>
<source srcset="https://static-eu.insales.ru/.../600/600/.../product.png@webp" type="image/webp">
<img src="https://static-eu.insales.ru/.../600/600..product.png" class="product-image" data-index="1" alt="товар" title="товар">
</picture>
---
{{ collection.image | webp_picture_tag: 600 }}
На выходе получаем =>
<picture>
<source srcset="https://static-eu.insales.ru/.../600/600/.../image_original.jpg@webp" type="image/webp">
<img src="https://static-eu.insales.ru/r/.../600/600/.../image_original.jpg">
</picture>
Фильтр select_option создает HTML-элемент <option> для использования внутри тега <select>. Он автоматически устанавливает атрибут selected, если переданное значение совпадает с выбранным значением.
▎Параметры
- value: Значение опции (будет использовано в атрибуте value).
- selected: Текущее выбранное значение.
- name: Отображаемое имя опции (текст внутри тега <option>).
▎Возвращаемое значение
Возвращает строку, представляющую HTML-элемент <option>.
1. Базовое использование:
{% assign current_value = "2" %}
{{ "1" | select_option: current_value, "Опция 1" }}
{{ "2" | select_option: current_value, "Опция 2" }}
{{ "3" | select_option: current_value, "Опция 3" }}
Результат:
<option value='1'>Опция 1</option>
<option selected value='2'>Опция 2</option>
<option value='3'>Опция 3</option>
Пример для селекта с выбором количества товаров на странице
<form action="{{collection.url}}" method="get">
<select name="page_size">
{{ "24" | select_option: page_size, "24 товара" }}
{{ "48" | select_option: page_size, "48 товара" }}
{{ "72" | select_option: page_size, "72 товара" }}
</select>
</form>
Фильтр link_to используется для создания HTML элемента ссылки (<a>) из заданного URL и текста ссылки. Кроме того, он допускает необязательный атрибут title для ссылки.
Параметры
Возвращаемое значение
Возвращает строку, представляющую собой HTML элемент <a>.
{{ "Перейти в корзину" | link_to: cart_url, "Ваша корзина" }}
<a href="/cart_items" title="Ваша корзина">Перейти в корзину</a>
{% if user %}
Привет, {{ user.name }}
{% endif %}
{% if user %}
Привет, {{ user.name }}
{% else %}
<a href="/client_account/contacts/new">Зарегистрироваться</a>
{% endif %}
{% if user.name == 'tobi' %}
Hello tobi
{% elsif user.name == 'bob' %}
Hello bob
{% else %}
Hello guest
{% endif %}
{% unless product.title contains 'колбаса' %}
Это не колбаса
{% endunless %}
{% case handle %}
{% when 'cake' %}
This is a cake
{% when 'cookie' %}
This is a cookie
{% else %}
This is not a cake nor a cookie
{% endcase %}
{% if product.title == "колбаса" %}
Это колбаса
{% endif %}
{% if product.title != 'колбаса' %}
Это не колбаса
{% endif %}
{% if collection.products > 10 %}
Товаров больше 10
{% endif %}
{% if collection.products < 10 %}
Товаров меньше 10
{% endif %}
{% if collection.products >= 10 %}
Товаров больше или равно 10
{% endif %}
{% if collection.products <= 10 %}
Товаров меньше или равно 10
{% endif %}
{% if collection.subcollections.size > 0 or collection.title == 'Бренды' %}
коллекция бренды или коллекция включающая более 0 субколлекций
{% endif %}
{% if collection.subcollections.size > 0 and collection.title == 'Бренды' %}
Если имя коллекции - бренды и коллекция включает более 0 субколлекций
{% endif %}
{% if product.title contains 'Pack' %}
This product's title contains the word Pack.
{% endif %}
{% if article.tags contains 'Hello' %}
This article has been tagged with 'Hello'.
{% endif %}
{% for product in collection.products %}
{{ product.title }}
{% endfor %}
{% for i in (1..5) %}
{% if i == 4 %}
{% break %}
{% else %}
{{ i }}
{% endif %}
{% endfor %}
#=> 1 2 3
{% for i in (1..5) %}
{% if i == 4 %}
{% continue %}
{% else %}
{{ i }}
{% endif %}
{% endfor %}
#=> 1 2 3 5
{% cycle 'one', 'two', 'three' %}
{% cycle 'one', 'two', 'three' %}
{% cycle 'one', 'two', 'three' %}
{% cycle 'one', 'two', 'three' %}
#=> one
#=> two
#=> three
#=> one
{% cycle 'group 1': 'one', 'two', 'three' %}
{% cycle 'group 1': 'one', 'two', 'three' %}
{% cycle 'group 2': 'one', 'two', 'three' %}
{% cycle 'group 2': 'one', 'two', 'three' %}
#=> one
#=> two
#=> one
#=> two
{% for i in (0..5) %}
{% cycle '1', '2', '3' %}
{% endfor %}
#=> 1
#=> 2
#=> 3
#=> 1
#=> 2
#=> 3
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array limit:2 %}
{{ item }}
{% endfor %}
#=> 1 2
<!-- if array = [1,2,3,4,5,6] -->
{% for item in array offset:2 %}
{{ item }}
{% endfor %}
#=> 3 4 5 6
{% capture my_var %}<p>Первая строка</p>{% endcapture %}
{% capture my_var %}<p>Вторая строка</p>{% endcapture %}
{{ my_var }}
=> <p>Вторая строка</p>
{% capture my_var %}<p>Первая строка</p>{% endcapture %}
{% capture my_var %}{{ my_var }}<p>Вторая строка</p>{% endcapture %}
{{ my_var }}
=> <p>Первая строка</p>
=> <p>Вторая строка</p>
{% assign array = 'первый второй третий' | split: ' ' %}
{% for item in array %}
{% capture text_array %}[{{ item }}]{% endcapture %}
{% endfor %}
{{ text_array }} => [третий]
{% for item in array %}
{% capture text_array2 %}{{ text_array2 }}[{{ item }}]{% endcapture %}
{% endfor %}
{{ text_array2 }} => [первый][второй][третий]
Создать кешируемый блок. В качестве параметра уникальный ключ.
{% capture cache_menu_key %}cache_menu_key_{{ collections.last_updated_at }}_{{ language.locale }}{% endcapture %}
{% cache cache_menu_key %}
.. кешируемый код
{% endcache %}
Выводит доступные переменные в шаблоне, выводит список свойств объектов.
{% help %} - выведет доступные переменные.
{% help account %} - выведет список свойств объекта account.
{% for field in order.all_fields %}
{% help field %}
{% endfor %}
<% javascript code; %>
– javascript код
Между разделителями <% ... %> записывается и выполняется javascript код.
<%= HTMLString %>
– вывод строки как HTML
Содержимое переменной будет выводиться как HTML.
<%- text %>
– вывод строки в виде текста.
Теги будут будут преобразованы в текст. Например <hr>
-> <hr>
Теги script с типом type="text/template"
служат контейнерами для шаблонов.
Данные записанные в данном теге не будут отображаться на странице, таким образом мы прячем шаблон.
<script type="text/template" id="items-template">
<div class="items">
<% _.forEach(items, function(item) { %>
<div class="item-title">
<%- item.title %>
</div>
<div class="item-description">
<%= item.description %>
</div>
<% }); %>
</div>
</script>
Чтобы отрисовать шаблон на основе данных, нам нужно создать рендер функцию.
Рендер функция создается из написанного нами шаблона.
Это нужно для того чтобы заменить <%- title %> на данные из javascript объектов.
Чтобы создать рендер функцию нужно передать в метод _.template
содержимое нашего шаблона.
Для удобства мы записываем шаблоны в тег script type="text/template"
.
Получившийся результат можем вывести на страницу в виде html кода.
<div class="js-dinamic"></div>
<script type="text/template" id="hello">
hello <%= user %>!
</script>
<script type="text/javascript">
var compiled = _.template($('#hello').html());
$('.js-dinamic').html(compiled({ 'user': 'fred' }));
</script>
<script type="text/template" id="main-template">
Цикл из массива items.
<% _.forEach(items, function(item, index) { %>
<div class="item">
(<%- index %>) <%- item %>
</div>
<% }); %>
<div>
Используя внутри шаблона javascript методы, обязательно ставьте точку с запятой (;).
<% console.log(items); %>
<br>
Но если вызываем функцию которая возвращает значение то точка с запятой не ставится и в разделитель добавляется знак равно (=).
<%= textUpperCase('text') %>
=> TEXT
</div>
<div>
Операторы сравнения.
<% if (true) { %>
Истина
<% }else{ %>
Ложь
<% } %>
<% if (true) { %>
Только истина
<% } %>
</div>
Использование кода в атрибутах.
<% _.forEach(items, function(item, index) { %>
<div class="item" data-inex="<%- index %>">
<%- item %>
</div>
<% }); %>
</script>
<script type="text/javascript">
// Функция делает все буквы заглавными
function textUpperCase(text) {
return text.toUpperCase();
}
</script>
<script type="text/template" id="products-template">
<% _.forEach(items, function(item, product) { %>
<form class="card" data-product-id="<%= product.id %>">
<a href="<%= product.url %>" class="card-image">
<img src="<%= product.first_image.large_url %>">
</a>
<div class="card-title">
<a href="<%= product.url %>">
<%= product.title %>
</a>
</div>
<div class="card-prices">
<div class="card-price">
<%= Shop.money.format(product.variants[0].price) %>
</div>
<% if (product.variants[0].old_price){ %>
<div class="card-old_price">
<%= Shop.money.format(product.variants[0].old_price) %>
</div>
<% } %>
</div>
<div class="card-action">
<input type="hidden" name="variant_id" value="<%= product.variants[0].id %>" >
<div data-quantity>
<input type="text" name="quantity" value="1" />
<span data-quantity-change="-1">-</span>
<span data-quantity-change="1">+</span>
</div>
</div>
<div class="card-buy">
<% if (product.variants.size > 1){ %>
<a href="<%= product.url %>" class="btn">Подробнее</a>
<% }else{ %>
<button data-item-add class="btn" type="submit">В корзину</button>
<% } %>
</div>
</form>
<% }); %>
<!-- Если нужно узнать какие переменные переданы в рендер функцию, нужно вывести переменную obj.
<% console.log(obj); %> -->
</script>
Данный файл описывает, что нужно создавать в магазине при установке или инициализации темы.
"collections": {
"apparel":"Одежда",
"Tehnika":"Модная одежда",
}
"block_lists": {
"left": {
"title": "Блоки в категориях слева",
"blocks": ["special-offer", "banner"]
},
"news":"Новости"
}
"blocks": {
"Банер": {
"title": "Акции и распродажи",
"content": "50% на все товары!"
},
"Tovar-nedeli":"Товар недели",
"условия-доставки":"Условия доставки"
}
Шаблоны блоков записываются в поле block_templates
которое является объектом.
У шаблонов есть 2 обязательных поля - name
, block_fields
.
name - имя блока
block_fields - поля блока
У полей блоков могут быть поля name
, kind
, block_field_options
.
name - имя поля
kind - тип поля
block_field_options - список опций селекта
Типы полей:
text
- Текст
rich_text
- HTML
account_file
- Файл
collection_list
- Список категорий
collection
- Категория
select
- Выпадающий список
checkbox
- Чекбокс
{
"block_templates": {
"slider-block": {
"name": "Слайдер",
"block_fields": {
"link": {
"name": "Ссылка",
"kind": "text"
},
"description": {
"name": "Контент",
"kind": "rich_text"
},
"heading": {
"name": "Заголовок",
"kind": "text"
},
"collection": {
"name": "Категория",
"kind": "collection"
},
"image": {
"name": "Изображения",
"kind": "account_file"
},
"hide_heading": {
"name": "Скрыть заголовок?",
"kind": "checkbox"
},
"side": {
"kind" : "select",
"name" : "Расположение изображения",
"block_field_options": {
"is-right": "Справа",
"is-left": "Слева"
}
}
}
}
}
}
"blocks": {
"banner": {
"title": "Акции и распродажи",
"content": "50% на все товары!",
"block_template": "system-title-and-content"
}
}
"blocks": {
"first-slider": {
"title": "Акции и распродажи",
"heading": "Акции и распродажи",
"description": "50% на все товары!",
"link": "/page/sale",
"block_template": "slider-block"
}
},
"block_lists": {
"index-slider": {
"title": "Слайдер",
"blocks": ["first-slider"],
"block_template": "slider-block"
}
},
"block_templates": {
"slider-block": {
"name": "Слайдер",
"block_fields": {
"link": {
"name": "Ссылка",
"kind": "text"
},
"description": {
"name": "Контент",
"kind": "rich_text"
},
"heading": {
"name": "Заголовок",
"kind": "text"
},
"collection": {
"name": "Категория",
"kind": "collection"
},
"image": {
"name": "Изображения",
"kind": "account_file"
}
}
}
}
"menus": {
"main-menu":"Верхнее меню",
"first-footer":"Нижнее меню"
},
"menu_items": {
"main-menu": { "Ссылка1": "http://ya.ru", "Ссылка2": "cart", "Ссылка3": "account" }
}
"properties": {
"property_permalink": {
"title": "my_property",
"characteristics": {
"char_permalink_1": "char_title_1", "char_permalink_2": "char_title_2"
}
}
}
"pages": {
"delivery": "Доставка",
"payment": "Оплата" ,
"privacy-policy": {
"title": "Политика безопасности",
"content": "У нас все секьюрно)"
}
}
"blogs": {
"news": "Новинки",
"sales": {
"title": "Скидки",
"articles": {
"winter": "20% на зимнюю коллекцию",
"shose": {
"title": "5% на всю обувь",
"content": "5% на всю обувь",
"preview": "Обувь со скидкой!",
"author": "Админимтрация"
}
}
}
}
Чтобы создать виджет в шаблоне нужно указать следующие данные в setup.json:
widget_types
theme_widgets -> widget_lists
widget_types отвечает за создание виджета.
widget_types имеет следующие свойства:
"block_template": шаблон блокок которые будут добавляться в виджете
"name": заголовок виджета
"handle": уникальный пермалинк для типов виджетов
"type": "block_list_widget_type"
"snippet": название сниппета который будет привязан к виджету, например - "widget_shippet.liquid". Сниппет должен присутствовать в теме.
widget_lists содержит в себе виджет листы, которые содержат в себе массивы виджетов.
В ликвид доступна переменна widget_lists в которой по ключу можно получить массив виджетов.
widget_lists.index-list.widgets
widget_lists содержит массив объектов с полями:
"name": имя виджет листа (указать уникальное имя на латинице)
"handle": пермалинк виджет листа, используется для доступа в виджетам в ликвид (в пермалинке виджет листа запрещен символ нижнего подчеркивания)
"widgets" массив виджетов
В массиве виджетов находятся с объекты с указанным типом виджета и пермалинком панели блоков
"widget_type": тут указывается handle из widget_types
"data_handle": тут пермалинк из block_lists
{% for widgetDrop in widget_lists.index-list.widgets %}
{% widget widgetDrop %}
{% endfor %}
{
"block_lists": {
"mainblock": {
"block_template": "system-image-and-content",
"title": "Наша тестовая панель блоков",
"blocks": [
"image-text-1"
]
}
},
"blocks": {
"image-text-1": {
"block_template": "system-image-and-content",
"title": "Блок внутри тестового виджета",
"content": "Контент внутри тестового виджета",
"image": "empty.jpg"
}
},
"theme_widgets": {
"widget_lists": [{
"name": "index",
"handle": "index-list",
"widgets": [{
"widget_type": "test_handle",
"data_handle": "mainblock"
}]
}],
"widget_types": [{
"block_template": "system-image-and-content",
"name": "Заголовок тестового виджета",
"handle": "test_handle",
"type": "block_list_widget_type",
"snippet": "widget_test_snippet.liquid"
}]
}
}
social_net_profiles Профили в соцсетях array