Вывод похожих товаров с изображениями (XSLT)

Задача: на сайте, требуется реализовать, чтобы при просмотре объекта каталога пользователь под описанием товара и его характеристик видел: "С этим товаром обычно покупают" и ссылка на аксессуар с его изображением, или "Похожий товар" и ссылка, и т.д.

Решение: В стандартном шаблоне demodizzy уже внедрено необходимое решение по выводу подобных ссылок (wiki.umisoft.ru/Пример_использования_поля_"ссылка_на_дерево"), но они выводятся без изображений товаров. Предлагаемое решение также подойдет и для сайтов из каталога готовых шаблонов.

Доработка стандартного шаблона будет заключаться в следующем:

1) Откроем файл /templates/demodizzy/xslt/modules/catalog/recommended.xsl и уберем из него следующую часть кода:

	<xsl:template match="property[@name = '&property-recommended;']">
		<hr />
		<h4>
			<xsl:text>&recommended-items;:</xsl:text>
		</h4>
		
		<xsl:apply-templates select="value/page" mode="short-view">		
			<xsl:with-param name="cart_items" select="document('udata://emarket/cart/')/udata/items" />
		</xsl:apply-templates>
		
		<div class="clear"></div>
	</xsl:template>

2)Вместо убранного кода, добавим наш:

    <xsl:template match="property[@name = '&property-recommended;']" mode="extra_goods">
        <p><strong><xsl:value-of select="title" />:</strong></p>
        <div style="width:100%; overflow: hidden;padding: 2px 0;" ><xsl:apply-templates select="value/page"  mode="extra_goods" /></div> 
    </xsl:template>
    
    <xsl:template match="page"  mode="extra_goods">    
       <div style="float: left; width:31%;text-align:center;border:1px #FE8D00 solid;margin: 0 5px;"> 
			<a href="{@link}">
				<xsl:apply-templates select="document(concat('upage://', @id,'.photo'))/udata" mode="extra_goods"/>
			</a>
			<p><strong><xsl:value-of select="name" /></strong></p>
		</div>
    </xsl:template>

	 <xsl:template match="property"  mode="extra_goods"> 
		<xsl:apply-templates select="document(concat('udata://system/makeThumbnail/(',substring(value,2),')/(auto)/100'))/udata" />
    </xsl:template>

В добавленном коде, мы получаем xml свойства &property-recommended; и обращаемся к каждому элементу <page> через темплейт match="page" mode="extra_goods", в котором мы выводим имя товара и ссылку на него, а также через протокол upage и id страницы получаем путь к изображению товара, который передаем в темплейт match="property" mode="extra_goods", где при помощи макроса system/makeThumbnail/ получаем миниатюру изображения с нужными нам размерами. Вывод информации оформлен при помощи встроенных в теги div стилевых правил, которые в реальном проекте лучше вынести в файл css. Так как макрос makeThumbnail работает с путями к изображениям без предваряющего слеша /, а получаемый путь через upage этот слеш содержит, то чтобы его вырезать была применена строковая функция substring (), которая вернула путь начиная со 2-го символа, т.е. весь путь к изображению, но без первого слеша.

3) В файле /templates/demodizzy/xslt/modules/catalog/object-view.xsl необходимо найти темплейт <xsl:template match="/result[@module = 'catalog' and @method = 'object']"> и в нем для элемента apply-templates со свойством &property-recommended; добавить mode:

			<div>
				<xsl:apply-templates select=".//property[@name = '&property-recommended;']" mode="extra_goods" />
			</div>

В результате у нас получиться: