В HostCMS есть дополнительные свойства, которые позволяют делать потрясающие штуки с интернет-магазином и информационными системами. Подробно о них можете прочитать в нашей статье: «Дополнительные свойства в HostCMS». Однако они будут совершенно бесполезны, если мы их не выведем в XSL.

Вручную свойства выводятся в XSL конструкцией <xsl:value-of select=»»/>, а в select мы передаём уже то, что хотим найти, например property_value[tag_name=’string_or_number’]/value, т.е значение свойства с именем string_or_number.

Где найти tag_name у дополнительного свойства?

Для магазина: заходим в свой интернет-магазин через админку, переход по кнопке товары, выбираем Свойства товара и получаем список. В колонке XML-тег будет нужный tag_name.

Открываем список дополнительных свойств Hostcms

Колонка XML-тег:

Hostcms tag name в списке допсвойств

Для информационной системы: аналогично заходим в инфосистему, например Новости, нажимаем Информационный элемент, выбираем Дополнительные свойства:

список свойств инфосистемы hostcms

Мы знаем tag name, мы примерно знаем как выводить, остался вопрос: Куда?

В XSL-шаблоны. Переходим в раздел XSL, Находим нужный и нажимаем на зеленую кнопку с карандашом «Редактировать»:

редактирование xsl в hostcms

А теперь краткий экскурс, куда именно вставлять вывод tag name:

Для информационной системы:

<!-- Шаблон выводит ссылки подгруппы информационного элемента -->
<xsl:template match="informationsystem_group" mode="groups">
  Cюда мы вставляем свойства групп информационной системы
</xsl:template>

<!-- Шаблон вывода информационного элемента -->
<xsl:template match="informationsystem_item">
  А сюда вставляем свойства элементов информационной системы
</xsl:template>

Для интернет-магазина:

<!-- Шаблон для групп товара -->
<xsl:template match="shop_group">
  Сюда мы вставляем свойства групп интернет-магазина
</xsl:template>

<!-- Шаблон для товара -->
<xsl:template match="shop_item">
  А сюда мы вставляем свойства товаров интернет-магазина
</xsl:template>

Уже сейчас, когда вы попробовали — могло не получиться. Для этого прочитайте «Дополнительные свойства в HostCMS не отображаются. Почему?«.

Как вручную вывести дополнительные свойства через tag name

Вывод допсвойства типа «Строка», «Число», «Дата»

<xsl:value-of select="property_value[tag_name='string_or_number']/value"/>

Вывод допсвойства типа Большое текстовое поле и Визуальный редактор

Здесь обязательно использовать атрибут disable-output-escaping для value-of, иначе вместо оформленного текста у вас будет каша из тегов.

<xsl:value-of disable-output-escaping="yes" select="property_value[tag_name='big_text']/value"/>

Вывод допсвойства типа Файл

В данном случае dir выведет путь до файла, а property_value название файла с расширением как он сохранен на сервере. Обращаю внимание: дополнительные свойства можно выводить внутри html атрибутов, например href, src, style и.т.д, что открывает огромные возможности. В html атрибутах допсвойства нужно прописывать в фигурных скобках: {свойство}.

Вот вывод изображения:

<img src="{dir}{property_value[tag_name='our_file']/file}" />

А вот вывод ссылки:

<a href="{dir}{property_value[tag_name='our_file']/file}">Ссылка на файл</a>

Если выводится картинка, то у файла есть малое изображение и большое. Каждое из них можно вывести отдельно:

Малое изображение
<img src="{dir}{property_value[tag_name='our_file']/file_small}" />
Большое
<img src="{dir}{property_value[tag_name='our_file']/file}" />

Вывод малого и большого изображения позволяет делать всплывающие картинки типа Fancybox, lightbox и прочие вот так:

<a href="{dir}{property_value[tag_name='our_file']/file}" class="fancybox" rel="gallery">
  <img src="{dir}{property_value[tag_name='our_file']/file_small}" />
</a>

Т.е в картинке мы вводим миниатюру, а при нажатии на картинку открывается оригинал

Вывод допсвойства типа «Флажок»

Дополнительное свойства флажок имеет только два значения — отмечено или неотмечено, 1 или 0, поэтому область его применения не велика. В основном использование флажка сводится к проверке: если он отмечен, то сделать одно действие, а если не отмечен другое. С этого места мы плавно подходим к тому, что в XSL-шаблонах часто используются циклы и условия. Рассмотрим действие флажка на примере условия if:

<xsl:if test="property_value[tag_name='our_checkbox']/value !='0'">  
  Выводим здесь данные, если флажок активен
</xsl:if>

А вот проверка на заполненность описания:

<xsl:if test="description !=''">  
  <xsl:value-of disable-output-escaping="yes" select="description"/>
</xsl:if>

Есть второй вид двойного условия через choose (аналог If-else):

<xsl:choose>
  <xsl:when test="property_value[tag_name='our_checkbox']/value !='0'">
    Выводим здесь данные, если флажок активен
  </xsl:when>
  <xsl:otherwise>
    Вывод при неактивном флажке
  </xsl:otherwise>
</xsl:choose>

Кроме условий есть еще и циклы for-each, которые нужны для вывода нескольких значений у свойства.

Вывод множественных значений у свойства в Hostcms

Представим, что картинок у вашей новости несколько. вы отметили при создании свойства опцию «Разрешить множественные значения для свойства» вот так:

Разрешить множественные значения для свойства в hostcms

Понажимали кнопки добавления еще одного значения для допсвойства типа Файл:

множественные значения у файла в hostcms

И загрузили картинки. Теперь вам нужно вывести их в XSL шаблоне вот так:

<xsl:for-each select="property_value[tag_name='products']">
  <img src="{../dir}{file}"/>
</xsl:for-each>

У dir нам нужно вернуться на предыдущий уровень XML документа, поэтому мы ставим «../dir», а для получения названия и расширения файла пишем просто file. И теперь в цикле пройдёт перебор всех картинок и мы получим сразу несколько тегов img. Оформление уже за вами — всё это можно обернуть в совершенно любую верстку.

Вывод описания файла в HostCMS

У допсвойства типа «Файл» есть поле описание, как у малого, так и большого формата.

Вывод описания файла в hostcms

Это позволит например задать понятное человеку название документа или прописать нужные для SEO alt у картинок и title у ссылок. Выводим его так:

Для одиночной картинки или документа
<img src="{dir}{property_value[tag_name='our_file']/file}" title="{property_value[tag_name='our_file']/file_description}" alt="{property_value[tag_name='our_file']/file_description}"/>

Для цикла
<xsl:for-each select="property_value[tag_name='our_file']">
  <img src="{../dir}{file_small}" title="{file_small_description}" alt="{file_small_description}" />
</xsl:for-each>

А теперь продолжим тему циклов.

Вывод допсвойства типа «Интернет-магазин» и «Информационная система»

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

допсвойство типа "интернет-магазин" в hostcms

Выводим свойство в XSL-шаблон, например, с помощью такой элементарной верстки (картинка + ссылка на товар):

<xsl:for-each select="property_value[tag_name='products']">

  <img class="item_img" src="{shop_item/dir}{shop_item/image_small}"  alt="{shop_item/name}" title="{shop_item/name}" />
  <a class="item-title" href="{shop_item/url}" title="{shop_item/name}">
    <xsl:value-of select="shop_item/name" />
  </a>

</xsl:for-each>

На что здесь нужно обратить внимание?

На приставку shop_item перед свойством. Всё пишется как обычно, но с shop_item: shop_item/dirshop_item/name и так далее. Такое мы делали для шаблона Нивакс Лайт, вот пример со связанными товарами.

Еще один очень полезный нюанс.

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

Полезно всегда проверять перед выводом цикла на количество значений свойства, чтобы лишний раз не дергать XSL обработчик и чтобы контролировать вывод элементов. Покажу на примере: у нас есть товары, в которых должны быть показаны связанные новости, а перед новостями должен стоять заголовок h2. Получается что если новости есть, то и заголовок есть, в противном случае его надо убирать. Как это сделать без проверки количества? Никак. Вот так надо:

<xsl:if test="count(property_value[tag_name='our_news']/informationsystem_item) &gt; 0">

  <h2>Связанные новости</h2>

  <xsl:for-each select="property_value[tag_name='our_news']">

    <img class="item_img" src="{informationsystem_item/dir}{informationsystem_item/image_small}"  alt="{informationsystem_item/name}" title="{informationsystem_item/name}" />
    <a class="item-title" href="{informationsystem_item/url}" title="{informationsystem_item/name}">
      <xsl:value-of select="informationsystem_item/name" />
    </a>

  </xsl:for-each>

</xsl:if>

В данном примере вы видите сразу две вещи:

  1. как проверить количество значений у свойства
  2. пример вывода допсвойства типа «Информационная система»

Вывод всех дополнительных свойств в HostCMS автоматически

Автоматический вывод свойств будет полезен для интернет-магазинов или каталогов, в которых товары обладают большим числом характеристик. Так мы делали для многих магазинов: выводим сам шаблон для свойств через apply-templates.

<xsl:if test="count(property_value)">
  <h2>Характеристики товара</h2>
  <xsl:apply-templates select="property_value"/>
</xsl:if>

А внутри шаблона property_value делаем нужное оформление:

<xsl:template match="property_value">
  <xsl:if test="value/node() and value != '' or file/node() and file != ''">
    <div class="shop_property">
      <xsl:variable name="property_id" select="property_id" />
      <xsl:variable name="property" select="/shop/shop_item_properties//property[@id=$property_id]" />

      <xsl:value-of select="$property/name"/><xsl:text>: </xsl:text>
      <span><xsl:choose>
          <xsl:when test="$property/type = 2">
            <a href="{../dir}{file}" target="_blank"><xsl:value-of select="file_name"/></a>
          </xsl:when>
          <xsl:when test="$property/type = 5">
            <a href="{informationsystem_item/url}"><xsl:value-of select="informationsystem_item/name"/></a>
          </xsl:when>
          <xsl:when test="$property/type = 7">
            <input type="checkbox" disabled="disabled">
              <xsl:if test="value = 1">
                <xsl:attribute name="checked">checked</xsl:attribute>
              </xsl:if>
            </input>
          </xsl:when>
          <xsl:when test="$property/type = 12">
            <a href="{shop_item/url}"><xsl:value-of select="shop_item/name"/></a>
          </xsl:when>
          <xsl:otherwise>
            <xsl:value-of disable-output-escaping="yes" select="value"/>
            <!-- Единица измерения свойства -->
            <xsl:if test="$property/shop_measure/node()">
              <xsl:text> </xsl:text><xsl:value-of select="$property/shop_measure/name"/>
            </xsl:if>
          </xsl:otherwise>
      </xsl:choose></span>
    </div>
  </xsl:if>
</xsl:template>

На этом всё. Мы разобрались как пользоваться tag name в Hostcms и углубились в типы дополнительных свойств. Если будут вопросы — спрашивайте.