Курс 2016 года “Разработка на UMI.CMS от 0 до готового сайта”

0 Пользователей и 1 Гость просматривают эту тему.

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Здравствуйте!

Задача такая: отобразить на странице объекта каталога (гостиницы) группу полей с двумя разными полями.
1-е поле с текстом (тип "HTML-текст") + 2-е поле с фотографией (тип данных "Фотография").
То есть пользователь в этой админке заполняет 1-е поле текстом, а во 2-е поле загружает фотографию через файловый менеджер ( как пример - через кнопку "Обзор" по аналогии с процессом загрузки фотографий в новостях)

И на сайте в итоге и по идее пользователь видит загруженное фото рядом с текстом, при чём что главное фотография при нажатии увеличивается с эффектом "лайтбокс".


Решение почти реализовано так:
<xsl:template match="udata" mode="hotel-object-view">
   <xsl:apply-templates select=".//group[@name = 'hotel_restaurants' and not(property/value='')]" mode="hotel-restaurant" />
</xsl:template>

   <xsl:template match="group" mode="hotel-restaurant">
         <h3><xsl:value-of select="concat(title, ':')" /></h3>
         <xsl:apply-templates select="property" disable-output-escaping="yes" mode="hotel-restaurant" />
</xsl:template>
    <xsl:template match="property[@type='img_file']/value" mode="hotel-restaurant">
<div class="cell1"><xsl:value-of select="." disable-output-escaping="yes" /></div>  
</xsl:template>
<xsl:template match="property" mode="hotel-restaurant">                                  
          <div class="cell2"><xsl:value-of select="value" disable-output-escaping="yes" /> </div>
</xsl:template>
 

где  <h3><xsl:value-of select="concat(title, ':')" /></h3> - заголовок группы полей, а
    <xsl:template match="property[@type='img_file']/value" mode="hotel-restaurant">
      <div class="cell1"><xsl:value-of select="." disable-output-escaping="yes" /></div>  
   </xsl:template>    

попытка вывести отдельно фотографию....

Но на странице объекта каталога успешно выводиться только текст,
а вместо фотографии только голая ссылка на неё "/images/hotels_spb/5_star_hotels/astoria_kandinsky_bar.jpg"

Вопрос:
как сделать так, что бы в шаблоне можно было сообщить системе, что изображение надо выводить в таком формате:
<div class="cell1">
                       <a class="fancybox-buttons" rel="media-gallery" href="{.//property[@name = 'picture_situation']/value}" title="{.//group[@name='hotel_restaurants']/title}">
                           <xsl:call-template name="catalog-thumbnail">
             <xsl:with-param name="element-id" select="page/@id" />
             <xsl:with-param name="field-name">picture_situation</xsl:with-param>
             <xsl:with-param name="width">220</xsl:with-param>
              </xsl:call-template>
                        </a>
                      </div>

?

 
« Последнее редактирование: 05 Сентября 2013, 23:35:46 от Axiomateria »

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
В дополнение к сему - пробовал такой вариант, как
   <xsl:template match="group" mode="hotel-restaurant">
         <h3><xsl:value-of select="concat(title, ':')" /></h3>
                              <div class="cell1">
                       <a class="fancybox-buttons" rel="media-gallery" href="{.//property[@name = 'picture_situation']/value}" title="{.//group[@name='hotel_restaurants']/title}">
                           <xsl:call-template name="catalog-thumbnail">
             <xsl:with-param name="element-id" select="page/@id" />
             <xsl:with-param name="field-name">picture_situation</xsl:with-param>
             <xsl:with-param name="width">220</xsl:with-param>
              </xsl:call-template>
                        </a>
                      </div>
         <xsl:apply-templates select="property" disable-output-escaping="yes" mode="hotel-restaurant" />
</xsl:template>

Но в таком случае миниатюрка (превьюшка) загруженной фотографии не грузится, хотя при нажатии на неё фотография успешно увеличивается "лайтбоксом".

*

NOIRMAN

  • *****
  • 101
  • +16/-1
    • Просмотр профиля
Попробуйте заменить имена параметров на те же имена, но с нижним подчеркиванием  - "element-id" = "element_id".
В одном из своих проектов именно это и помогло ...

*

NOIRMAN

  • *****
  • 101
  • +16/-1
    • Просмотр профиля
Долго разглядывал первое сообщение (там где фотография не выводится рядом с текстом) и не нашел в коде нигде вызова тега <img>.

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Попробуйте заменить имена параметров на те же имена, но с нижним подчеркиванием  - "element-id" = "element_id".
В одном из своих проектов именно это и помогло ...
К сожалению не сработало....

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Долго разглядывал первое сообщение (там где фотография не выводится рядом с текстом) и не нашел в коде нигде вызова тега <img>.

Действительно этого тега нет в этом шаблоне, так как тег <img> вставляется через вызов
                        <xsl:call-template name="catalog-thumbnail">
           <xsl:with-param name="element-id" select="page/@id" />
           <xsl:with-param name="field-name">photo_conference_hall</xsl:with-param>
           <xsl:with-param name="width">220</xsl:with-param>
           </xsl:call-template>
Этот вызов я скопировал из шаблона фотоальбома для формирования превьюшки фотографии с фиксированным размером ширины 220px

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

Можно уонечно и сразу так вместо этого вызова вставить
<img src="{.//property[@name = 'picture_situation']/value}" alt="{.//property[@name='h1']/value}" />
НО тогда как размер превьюшкеи зафиксировать в 220px если без CSS? .
 
« Последнее редактирование: 06 Сентября 2013, 12:54:35 от Axiomateria »

*

e.ioffe

  • ****
  • 369
  • +81/-2
  • Профессиональная разработка на UMI.CMS.
    • Просмотр профиля
    • Fullspace - Лучший хостинг для UMI.CMS
Дайте ссылку на страницу
Ускорение сайта на UMI.CMS - http://speed.umispec.ru/

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Дайте ссылку на страницу
Пока сайт на заглушке, но я могу дать вам кусок кода из xml этой страницы:
<group id="436" name="conferencing_capabilities">
<title>Конференц возможности</title>
<property id="447" name="photo_conference_hall" type="img_file">
<title>Фото конференц зала</title>
<value path="./images/hotels_spb/5_star_hotels/astoria_ballroom.jpg" folder="/images/hotels_spb/5_star_hotels" name="astoria_ballroom" ext="jpg" width="800" height="531">/images/hotels_spb/5_star_hotels/astoria_ballroom.jpg</value>
</property><property id="448" name="description_conference_features_hotel" type="wysiwyg">
<title>Описание конференц возможностей</title>
<value>
  <p>Гостиница Астория располагает большими ресурсами для проведения мероприятий любого уровня - от неформальной встречи в узком кругу до крупной международной конференции.</p>
  <p>Астория может разместить до 450 человек, объединив Банкетный зал и зал Зимний сад, где в распоряжение гостей будет предоставлено самое современное оборудование.</p>
  <p>В Астории имеются переговорные комнаты с новейшими техническими средствами, широкополосным и беспроводным Интернетом.</p>
  <p>К услугам гостей также Бизнес-центр.</p>
</value>
</property>
</group>
« Последнее редактирование: 06 Сентября 2013, 13:27:29 от Axiomateria »

*

NOIRMAN

  • *****
  • 101
  • +16/-1
    • Просмотр профиля
Покажите код вызываемого шаблона "catalog-thumbnail".

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Покажите код вызываемого шаблона "catalog-thumbnail".
Если я вас правильно понял, то код HTML такой в итоге получается, где <img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" это грузящаяся картинка "no foto" из demodizzy
<a class="fancybox-buttons" rel="media-gallery" href="/images/hotels_spb/5_star_hotels/astoria_ballroom.jpg" title="На фотографии зал для конференций в отеле"><img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" alt="Главная" itemprop="image" height="204" width="220"></a>
« Последнее редактирование: 06 Сентября 2013, 14:43:06 от Axiomateria »

*

NOIRMAN

  • *****
  • 101
  • +16/-1
    • Просмотр профиля
Если я вас правильно понял, то код HTML такой в итоге получается, где <img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" это грузящаяся картинка "no foto" из demodizzy
<a class="fancybox-buttons" rel="media-gallery" href="/images/hotels_spb/5_star_hotels/astoria_ballroom.jpg" title="На фотографии зал для конференций в отеле"><img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" alt="Главная" itemprop="image" height="204" width="220"></a>
Не совсем правильно меня поняли. Код шаблона name="catalog-thumbnail" хочется посмотреть

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
Если я вас правильно понял, то код HTML такой в итоге получается, где <img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" это грузящаяся картинка "no foto" из demodizzy
<a class="fancybox-buttons" rel="media-gallery" href="/images/hotels_spb/5_star_hotels/astoria_ballroom.jpg" title="На фотографии зал для конференций в отеле"><img src="/images/cms/thumbs/b9efc5210e47f3649ffa75dc61236c6c30f2196e/logo_220_auto_5_80.png" alt="Главная" itemprop="image" height="204" width="220"></a>
Не совсем правильно меня поняли. Код шаблона name="catalog-thumbnail" хочется посмотреть

В таком случае вот код полностью:
<xsl:stylesheet	version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:umi="http://www.umi-cms.ru/TR/umi">
<xsl:template name="catalog-thumbnail">
<xsl:param name="element-id" />
<xsl:param name="field-name" />
<xsl:param name="empty" />
<xsl:param name="width">auto</xsl:param>
<xsl:param name="height">auto</xsl:param>
<xsl:param name="item">1</xsl:param>
<xsl:param name="align" />

<xsl:variable name="property" select="document(concat('upage://', $element-id, '.', $field-name))/udata/property" />

<xsl:call-template name="thumbnail">
<xsl:with-param name="width" select="$width" />
<xsl:with-param name="height" select="$height" />
<xsl:with-param name="align" select="$align" />
<xsl:with-param name="item" select="$item"/>

<xsl:with-param name="element-id" select="$element-id" />
<xsl:with-param name="field-name" select="$field-name" />
<xsl:with-param name="empty" select="$empty" />

<xsl:with-param name="src">
<xsl:choose>
<xsl:when test="$property/value">
<xsl:value-of select="$property/value" />
</xsl:when>
<xsl:otherwise>&empty-photo;</xsl:otherwise>
</xsl:choose>
</xsl:with-param>
</xsl:call-template>
</xsl:template>

<xsl:template name="thumbnail">
<xsl:param name="src" />
<xsl:param name="width">auto</xsl:param>
<xsl:param name="height">auto</xsl:param>
<xsl:param name="empty" />
<xsl:param name="align" />
<xsl:param name="item" />

<xsl:param name="element-id" />
<xsl:param name="field-name" />

<xsl:apply-templates select="document(concat('udata://system/makeThumbnailFull/(.', $src, ')/', $width, '/', $height, '/void/0/1/'))/udata">
<xsl:with-param name="element-id" select="$element-id" />
<xsl:with-param name="field-name" select="$field-name" />
<xsl:with-param name="empty" select="$empty" />
<xsl:with-param name="align" select="$align" />
<xsl:with-param name="item" select="$item" />
</xsl:apply-templates>
</xsl:template>

<xsl:template match="udata[@module = 'system' and (@method = 'makeThumbnail' or @method = 'makeThumbnailFull')]">
<xsl:param name="element-id" />
<xsl:param name="field-name" />
<xsl:param name="empty" />
<xsl:param name="align" />
<xsl:param name="item" />

<img src="{src}" width="{width}" height="{height}" alt="{document(concat('upage://', $element-id))/udata/page/name}">
<xsl:if test="$element-id and $field-name">
<xsl:attribute name="umi:element-id">
<xsl:value-of select="$element-id" />
</xsl:attribute>

<xsl:attribute name="umi:field-name">
<xsl:value-of select="$field-name" />
</xsl:attribute>
</xsl:if>

<xsl:if test="$align">
<xsl:attribute name="align">
<xsl:value-of select="$align" />
</xsl:attribute>
</xsl:if>

<xsl:if test="$empty">
<xsl:attribute name="umi:empty">
<xsl:value-of select="$empty" />
</xsl:attribute>
</xsl:if>

<xsl:if test="$item = 1">
<xsl:attribute name="itemprop">image</xsl:attribute>
</xsl:if>
</img>
</xsl:template>
</xsl:stylesheet>

*

e.ioffe

  • ****
  • 369
  • +81/-2
  • Профессиональная разработка на UMI.CMS.
    • Просмотр профиля
    • Fullspace - Лучший хостинг для UMI.CMS
У вас не работает строчка

<xsl:with-param name="element-id" select="page/@id" />, так как в ветке group нет значений page. Покажите полностью шаблон
Ускорение сайта на UMI.CMS - http://speed.umispec.ru/

*

Axiomateria

  • ****
  • 322
  • +5/-0
    • Просмотр профиля
    • Разработка продающих сайтов под ключ по честным ценам
У вас не работает строчка

<xsl:with-param name="element-id" select="page/@id" />, так как в ветке group нет значений page. Покажите полностью шаблон

Уточните пожалуйста какой теперь шаблон вам показать.

*

e.ioffe

  • ****
  • 369
  • +81/-2
  • Профессиональная разработка на UMI.CMS.
    • Просмотр профиля
    • Fullspace - Лучший хостинг для UMI.CMS
У вас не работает строчка

<xsl:with-param name="element-id" select="page/@id" />, так как в ветке group нет значений page. Покажите полностью шаблон

Уточните пожалуйста какой теперь шаблон вам показать.

Тот, в котором вызываете <xsl:apply-templates select="что-то тут" mode="hotel-object-view" />

Определены ли переменные с именами pageId или page-id (как правило, определяются в файле common.xsl)?
Ускорение сайта на UMI.CMS - http://speed.umispec.ru/