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

Материал из Umicms
Перейти к:навигация, поиск
Строка 51: Строка 51:
 
</group>
 
</group>
 
</source>
 
</source>
 +
 +
Обработать это дерево можно с помощью следующей конструкции:
 +
 +
<source lang="xml">
 +
<div style="max-width: 300; max-height: 300;">
 +
<ul class="bxslider">
 +
<xsl:for-each select="./page/properties/group[@name = 'kartinki']/property[@type = 'img_file']">
 +
<li>
 +
<xsl:apply-templates select="document(concat('udata://system/makeThumbnail/(.', ./value, ')/200/auto'))"/>
 +
</li>
 +
</xsl:for-each>
 +
</ul>
 +
</div>
 +
</source>
 +
 +
и шаблона, знакомого нам по статье [[Несколько_изображений_к_товару_средствами_протокола_ufs]](bxslider мы берем оттуда же):
 +
 +
<source lang="xml">
 +
<xsl:template match="udata[@module = 'system' and @method = 'makeThumbnail']">
 +
<img src="{src}"/>
 +
</xsl:template>
 +
</source>
 +
  
 
== Вариант 2 ==
 
== Вариант 2 ==
 
  [[category:Модуль Каталог]]
 
  [[category:Модуль Каталог]]

Версия 09:02, 25 марта 2014

Актуально для версии 2.9.5

Задача

Вывести на сайте несколько изображений к товару, не прибегая к созданию дополнительных папок или страниц-фотографий(фотоальбомов).

Решение

Задачу можно решить средствами модуля "Шаблоны данных", ниже дан пример.

Вариант 1

1) Создадим в типе данных, к которому относится товар, столько полей типа изображение, сколько будет изображений у товара:

Fields simple.png

2) Создадим товар с этим типом данных и заполним созданные поля в карточке товара:

Fields simple page.png

3) Теперь осталось это вывести, вывод в tpl есть в статье Добавление_нескольких_фотографий_к_описанию_объекта_каталога, первый вариант. В xslt же все еще проще, у нас будет примерно следующий xml документ, который нужно обработать:

<group id="5573" name="kartinki">
	<title>Картинки</title>
	<property id="971" name="kartinka_1" type="img_file">
		<title>Картинка 1</title>
		<value path="./images/cms/data/sovet/sovet-cv_tc21.jpg" folder="/images/cms/data/sovet" name="sovet-cv_tc21" ext="jpg" width="680" height="499">/images/cms/data/sovet/sovet-cv_tc21.jpg</value>
	</property>
	<property id="972" name="kartinka_2" type="img_file">
		<title>Картинка 2</title>
		<value path="./images/cms/data/sovet/sovet-tc3.jpg" folder="/images/cms/data/sovet" name="sovet-tc3" ext="jpg" width="350" height="350">/images/cms/data/sovet/sovet-tc3.jpg</value>
	</property>
	<property id="973" name="kartinka_3" type="img_file">
		<title>Картинка 3</title>
		<value path="./images/cms/data/sovet/sovet-tv-tc1.jpg" folder="/images/cms/data/sovet" name="sovet-tv-tc1" ext="jpg" width="500" height="412">/images/cms/data/sovet/sovet-tv-tc1.jpg</value>
	</property>
	<property id="974" name="kartinka_4" type="img_file">
		<title>Картинка 4</title>
		<value path="./images/cms/data/sovet/soviet-tv-b1.jpg" folder="/images/cms/data/sovet" name="soviet-tv-b1" ext="jpg" width="500" height="375">/images/cms/data/sovet/soviet-tv-b1.jpg</value>
	</property>
	<property id="975" name="kartinka_5" type="img_file">
		<title>Картинка 5</title>
		<value path="./images/cms/data/sovet/soviet-tv-ba.jpg" folder="/images/cms/data/sovet" name="soviet-tv-ba" ext="jpg" width="680" height="573">/images/cms/data/sovet/soviet-tv-ba.jpg</value>
	</property>
	<property id="977" name="kartinka_6" type="img_file">
		<title>Картинка 6</title>
		<value path="./images/cms/data/sovet/soviet-tv-t7.jpg" folder="/images/cms/data/sovet" name="soviet-tv-t7" ext="jpg" width="890" height="630">/images/cms/data/sovet/soviet-tv-t7.jpg</value>
	</property>
</group>

Обработать это дерево можно с помощью следующей конструкции:

<div style="max-width: 300; max-height: 300;">
	<ul class="bxslider">
		<xsl:for-each select="./page/properties/group[@name = 'kartinki']/property[@type = 'img_file']">
			<li>
				<xsl:apply-templates select="document(concat('udata://system/makeThumbnail/(.', ./value, ')/200/auto'))"/>
			</li>
		</xsl:for-each>
	</ul>
</div>

и шаблона, знакомого нам по статье Несколько_изображений_к_товару_средствами_протокола_ufs(bxslider мы берем оттуда же):

<xsl:template match="udata[@module = 'system' and @method = 'makeThumbnail']">
	<img src="{src}"/>
</xsl:template>


Вариант 2