UMI.CMS Товары данной коллекции

Давненько я не писал статей по UMI.CMS, что очень печально...

За то время, которое не публиковал статьи я блоге успел «переучиться», ну или не переучиться а просто перейти на XSLT шаблонизатор UMI.CMS. Перейдя на данный шаблонизатор, понимаю, что он экономит огромное кол-во времени при разработки сайтов на UMI.CMS, и если вы до сих пор используете TPL шаблонизатор, я вам настоятельно рекомендую про него забыть и использовать XSLT. Я могу вам обещать, что вы будете экономить огромную массу времени при написание шаблонов для своих сайтов!

Данная статья будет посвящена такой интересной функциональности как «товары данной коллекции», что это такое, например, у вас есть определенная коллекция, в которую входит 2, 3, 5 различных товаров и вам нужно показывать данные товары на карточке товаров этой коллекции. Все предельно просто.
UMI.CMS Товары данной коллекции

Для реализации этого метода будет использоваться протокол USEL в UMI.CMS. Что этот протокол представляет из себя вы можете прочитать на wiki UMI.CMS. Если кратко сказать, то этот протокол позволяет совершать произвольные выборки из базы данных UMI.CMS.

Данный пример будет рассмотрен на шаблоне UMI.CMS DemoDizzy.

Для начала нужно перейти в модуль «шаблон данных» и у типа «объект каталога», это важно(!), добавить поле типа выпадающий список или выпадающий список с множественным выбором, я добавлю данное поле в секцию "Опции управления [manage_options]". Название поля «Коллекция», справочник для данного поля создавать не нужно, все будет сделано автоматически:

UMI.CMS Товары данной коллекции

UMI.CMS Товары данной коллекции

Обращаю ваше внимание, что данное поле нужно создавать именно у типа «объект каталога». Если данное поле будет создано не у данного тита, то вы гарантированно получите ошибку вида Field is not presented in selected object types при выборе через протокол USEL.

Если вы все же получила данную ошибку, то почитайте вот здесь 

После того как поле создано нужно перейти в справочники /admin/data/guides/ и найти справочник для поля «Коллекция». Он должен быть последним. Наводите на справочник, появляется иконка «глаз», нажимаете:

UMI.CMS Товары данной коллекции

Нужно добавить несколько названий для ваших коллекций. Так как я использую DemoDizzy, у меня будет немного странные названия:

UMI.CMS Товары данной коллекции

Перейдите в модуль «каталог» и назначите ваши коллекции нужным товарам:

UMI.CMS Товары данной коллекции

На этом с разметкой закончено. Далее нужно все показать вашим посетителям 😉

Перед тем как выводить товары, нужно добавить USEL файл, который будет обращаться к UMI. В папке usels вашего шаблона создаете файл get-collection.xml (путь — \templates\demodizzy\usels), содержание файла:

<?xml version="1.0" encoding="utf-8"?>
<selection>
    <target result="pages">
        <type module="catalog" method="object" />
    </target>

    <property name="kollekciya" value="{kollekciya}" /> <!-- Запрос нужно коллекции -->

    <sort>rand()</sort> <!-- Вывод рэндомно товары -->

    <limit page="0">{limit}</limit> <!-- Кол-во товаров для вывода -->
</selection>

Так как я использую шаблон DemoDizzy, я открываю файл object-view.xsl (путь — \templates\demodizzy\xslt\modules\catalog\).

За отображение вида карточки товара отвечает блок:

<xsl:template match="udata" mode="object-view">
...
</xsl:template>

Я предлагаю добавить отображение «товаров данной коллекции» ниже характеристик товара, т.е. вызов USEL будет происходить после:

<xsl:if test="$user-type = 'sv'">
	<xsl:apply-templates select=".//group[@name = 'manage_options']" mode="table" />
</xsl:if>

Нужно добавить:

<!-- Товары данной коллекции -->
<div class="b-collection">
	<!-- Получение id названия коллекции -->
	<xsl:variable name="kollekciya" select=".//property[@name = 'kollekciya']/value/item/@id" />
	<!-- Получение названия коллекции -->
	<xsl:variable name="kollekciya-nazvanie" select=".//property[@name = 'kollekciya']/value/item/@name" />

	<!-- Проверка если есть товары в коллекции, то нужно выводить данный блок -->
	<xsl:if test="$kollekciya">
		<h3 class="b-collection__title">Другие товары коллекции "<xsl:value-of select="$kollekciya-nazvanie" />"</h3>

		<xsl:apply-templates select="document(concat('usel://get-collection/?kollekciya=', $kollekciya, '&amp;limit=4'))/udata/page" mode="collection" />
	</xsl:if>
	<div class="spacer" />
</div>
<!-- / Товары данной коллекции -->

Далее в конец файла добавить вид отображения:

<xsl:template match="page" mode="collection">
	<div class="b-collection__item">
		<div class="item-name">
			<a href="{@link}" title="{name}"><xsl:value-of select="name" /></a>
		</div>
		<div class="item-image">
			<a href="{@link}" title="{name}">
				<xsl:call-template name="catalog-thumbnail">
					<xsl:with-param name="element-id" select="@id" />
					<xsl:with-param name="field-name">photo</xsl:with-param>
					<xsl:with-param name="width">100</xsl:with-param>
					<xsl:with-param name="height">100</xsl:with-param>
				</xsl:call-template>
			</a>
		</div>
	</div>
</xsl:template>

И также следует закинуть в css файл вашего шаблона:

.b-collection__item {
    float: left;
    float: left;
    margin-left: 25px;
}
.b-collection__item .item-name {}
.b-collection__item .item-image img {}
.spacer {
    clear: both;
    margin: 0;
    padding: 0;
}

На этом все. Вот так будет отображаться у вас на сайте:
UMI.CMS Товары данной коллекции

И я чуть не забыл, вот так должен выглядеть доктайп вашего файла, в котором будут выводится товары:

<!DOCTYPE xsl:stylesheet SYSTEM	"ulang://i18n/constants.dtd:file"[
    <!ENTITY amp  "&#38;">
]>
Bookmark the permalink.

Также может быть интересно:

  • AlRy

    А вот вывести бы все товары одной коллекции просто на одной странице...

    • Что вам мешает? Скрипт у вас есть, укажите кол-во, которое нужно выводить.

      Я бы данный метод не рекомендовал бы использоваться, если у вас сайт рассчитан на большое кол-во пользователей. Лучше воспользоваться umi selector — api.docs.umi-cms.ru/razra...yborki/selector/

      • AlRy

        Пример живой кода найти б. Вот как здесь все расписано 🙂

  • hotroad

    Usel однозначно мощная штука в umi-cms, а xslt однозначно на две головы выше tpl. Единственное, с чем я не разобрался — как исключить товар, который мы просматриваем из вывода в блок «Товары из этой коллекции», что бы не было повторений?