Столкнулся с неожиданным фактом: UMI CMS очень даже неплохо кастомизируется в плане пользовательского интерфейса административной части системы. Задача стояла очень простая: добавить в админку в модуль Новости кнопку для закачки видео на YouTube и последующей вставки кода этого видео в текстовое поле.

Порывшись в документации, я нашел вот такой забавный пример. В примере  подключается пользовательский xsl документ form.modify.custom.xsl, и на его плечи ложится вывод на экран поля Дата публикации из шаблона Новости. Единственное, документация похоже устарела и файл надо создавать не тут ~/styles/skins/full/news/form.modify.custom.xsl, а тут ~/styles/skins/full/data/modules/news/form.modify.custom.xsl,  и full соответственно надо заменить на Вашу tpl, у меня это было mac.

Приведу и сам xsl документ 

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
xmlns:xlink="http://www.w3.org/TR/xlink">
 <xsl:template match="field[@type = 'date']" mode="form-modify">
	<div>
	 <label for="{@name}"><xsl:value-of select="@title" /></label>
	 <input type="text" name="{@input_name}" value="{.}" id="{@name}" 
style="border: red 1px solid;" />
	</div>
</xsl:template>
</xsl:stylesheet>

Собственно выражение @type = 'date' и отвечает за то, чтобы произошла замена именно на тип date. Причем если в шаблоне данных Новости есть еще поля с типом date, они тоже заменятся. Мне надо было заменить лишь одно конкретное поле с типом text и именем video . Поэтому, не долго думая, я поменял условие на следующие

<xsl:template match="field[@type = 'text' and @name='video']" mode="form-modify">

Но чуда не случилось, документ попросту не сформировался. Тогда я нашел файл, который по дефолту отвечает за отображение поля с типом text. Этот файл у меня лежит тут ~/styles/skins/mac/form.modify.xsl 

За отображение обычного текстового поля в нем отвечает вот этот кусок кода:

<xsl:template match="field[@type = 'text']" mode="form-modify1">
	<div style="width: 100%; height: auto; float: left;" class="field">
	  <label for="{@name}">
	    <xsl:value-of select="@title"/>
	    <xsl:if test="@tip">
	      <img class="@tip" src="/images/cms/admin/full/ico_help.gif">
	        <xsl:attribute name="onmouseover">show_tip(this, '<xsl:value-of select="@name"/>',
'<xsl:value-of select="@title"/>', 
'<xsl:value-of select="@tip"/>')
	        </xsl:attribute>
	      </img>
	   </xsl:if>
	</label>
	<textarea name="{@input_name}" id="{@name}" style="width: 100%; height: 120px;">
	  <xsl:value-of select="."/>
	</textarea>
	</div>
</xsl:template>

Как мы можем видеть, разница тут в режиме, или по "ихнему" в mode, он, в отличии от поля date, имеет в конце 1.  Я добавил этот код в form.modify.custom.xsl и заменил условие подмены на  field[@type = 'text' and @name='video']

Теперь осталось лишь слегка модифицировать этот код, добавив кнопку, которая открывает в отдельном окне закачку на youtube

Окончательное содержание файла form.modify.custom.xsl

<?xml version="1.0" encoding="UTF-8"?
 
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
xmlns:xlink="http://www.w3.org/TR/xlink">
<xsl:template match="field[@name = 'video']" mode="form-modify1">
  <div style="width: 100%; height: auto; float: left;" class="field">
    <label for="{@name}">
      <xsl:value-of select="@title"/>
	<xsl:if test="@tip">
	<img class="@tip" src="/images/cms/admin/full/ico_help.gif">
	<xsl:attribute name="onmouseover">
         show_tip(this,'<xsl:value-of select="@name"/>',
'<xsl:value-of select="@title"/>', 
'<xsl:value-of select="@tip"/>')
	</xsl:attribute>
	</img>
      </xsl:if>
    </label>
    <textarea name="{@input_name}" id="{@name}" style="width: 100%; height: 120px;">
      <xsl:value-of select="."/>
    </textarea>
    <input type="button" value="Закачать видео" onclick="window.videoid='{@name}'; 
window.open('youtube.php','YouTube Downloader',
'left=200,width=720,height=400')"/>
  </div>
</xsl:template>
</xsl:stylesheet>

Таким образом можно модифицировать любые поля и типы.Как закачивать видео на YouTube с одной кнопки напишу в следующей статье ;)

Рассказать друзьям

Добавить комментарий


Защитный код
Обновить