|
|
| Строка 1: |
Строка 1: |
| − | = Что такое edit in place? ==
| + | doors.txt;5 |
| − | - edit in place (редактирование на месте) - это возможность редактировать свойства объектов и страниц прямо на сайте (без входа в административный интерфейс), возможность наглядно видеть, как будет выглядеть редактируемая страница
| |
| − | | |
| − | | |
| − | == Условия работы ==
| |
| − | 1. Пользователь должен быть авторизован и иметь права на использование edit in place
| |
| − | 2. Шаблон должен быть сверстан по определенным правилам
| |
| − | == Особенности верстки tpl-шаблона ==
| |
| − | 1. В шаблоне необходимо объявить пространство имен umi:
| |
| − | <source lang="xml">
| |
| − | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
| |
| − | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" xmlns:umi="http://www.umi-cms.ru/TR/umi">
| |
| − | ...
| |
| − | </html>
| |
| − | </source>
| |
| − | 2. Подключить JavaScript'ы для панели быстрого редактирования и для edit in place:
| |
| − | <source lang="xml">
| |
| − | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
| |
| − | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" xmlns:umi="http://www.umi-cms.ru/TR/umi">
| |
| − | <head>
| |
| − | ...
| |
| − | %system includeQuickEditJs()%
| |
| − | %system includeEditInPlaceJs()%
| |
| − | ...
| |
| − | </head>
| |
| − | <body>
| |
| − | ...
| |
| − | </body>
| |
| − | </html>
| |
| − | </source>
| |
| − | 3. Определить редактируемые области (поля), прописав тэгам определенные атрибуты. Смотрите описание пространства имен umi.
| |
| − | | |
| − | == Особенности верстки xsl-шаблона ==
| |
| − | 1. Необходимо определить пространство имен umi
| |
| − | 2. Подключить JavaScript'ы для панели быстрого редактирования и для edit in place, используя протокол udata
| |
| − | | |
| − | Пример шаблона:
| |
| − | <source lang="xml">
| |
| − | <?xml version="1.0" encoding="UTF-8"?>
| |
| − | <!DOCTYPE xsl:stylesheet [
| |
| − | <!ENTITY nbsp " ">
| |
| − | <!ENTITY middot "·">
| |
| − | <!ENTITY copy "©">
| |
| − | ]>
| |
| − | | |
| − | <xsl:stylesheet version="1.0"
| |
| − | xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
| |
| − | xmlns:php="http://php.net/xsl"
| |
| − | xmlns:date="http://exslt.org/dates-and-times"
| |
| − | xmlns:udt="http://umi-cms.ru/2007/UData/templates"
| |
| − | xmlns:umi="http://www.umi-cms.ru/TR/umi"
| |
| − | extension-element-prefixes="php"
| |
| − | exclude-result-prefixes="xsl php udt date">
| |
| − | | |
| − | <xsl:output method="html" version="4.01"
| |
| − | encoding="utf-8"
| |
| − | doctype-public="-//W3C//DTD HTML 4.01//EN"
| |
| − | doctype-system="http://www.w3.org/TR/html4/strict.dtd"
| |
| − | indent="yes"
| |
| − | cdata-section-elements="script noscript"
| |
| − | undeclare-namespaces="yes"
| |
| − | omit-xml-declaration="yes"/>
| |
| − | | |
| − | <xsl:template match="/">
| |
| − | <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" xmlns:umi="http://www.umi-cms.ru/TR/umi">
| |
| − | <head>
| |
| − | <xsl:value-of select="document('udata://system/includeQuickEditJs')/udata" disable-output-escaping="yes"/>
| |
| − | <xsl:value-of select="document('udata://system/includeEditInPlaceJs')/udata" disable-output-escaping="yes"/>
| |
| − | </head>
| |
| − | <body>
| |
| − | ...
| |
| − | </body>
| |
| − | </html>
| |
| − | </xsl:template>
| |
| − | </xsl:stylesheet>
| |
| − | </source>
| |
| − | 3. Определить редактируемые области (поля), прописав тэгам определенные атрибуты. Смотрите описание пространства имен umi.
| |
| − | | |
| − | == Описание атрибутов из пространства имен umi ==
| |
| − | Атрибуты из пространства имен umi необходимы для указания редактируемых регионов.
| |
| − | | |
| − | | |
| − | '''Список атрибутов:'''
| |
| − | '''umi:element-id''' - указывает идентификатор элемента (страницы), соответствующий редактируемой области. При наличии подключенной возможности "[[Виджеты]]" и если этот атрибут указан, создается редактируемый регион и появляется возможность удалить элемент из структуры.
| |
| − | | |
| − | '''umi:object-id''' - указывает идентификатор объекта, соответствующий редактируемой области. При наличии подключенной возможности "[[Виджеты]]" и если этот атрибут указан, создается редактируемый регион и появляется возможность удалить объект.
| |
| − | | |
| − | '''umi:field-name''' - указывает идентификатор свойства элемента или объекта (можно смотреть в шаблонах данных), с которым связана редактируемая область. Работает только в связке с umi:element-id или umi:object-id. Если umi:object-id и umi:element-id не указан, пытается взять его у первой родительской редактируемой области. Если этот атрибут указан и определен идентификатор объекта или элемента, создается редактируемый регион с возможностью править свойство.
| |
| − | | |
| − | '''umi:module''' и '''umi:method''' - указывает какому модулю и методу соответствует редактируемая область. Если оба атрибута указаны, создается редактируемый регион с возможностью добавлять объекты или элементы (при наличии подключенной возможности "[[Виджеты]]"). Если у области указан umi:element-id, то создаваемые элементы (страницы) будут создаваться дочерними от элемента, соответствующего идентификатору umi:element-id
| |
| − | | |
| − | == Примеры назначения редактируемых регионов ==
| |
| − | 1. Создаем редактируемый заголовок в tpl-шаблоне страницы:
| |
| − | <source lang="xml">
| |
| − | <h1 umi:element-id="%pid%" umi:field-name="h1">%header%</h1>
| |
| − | </source>
| |
| − | 2. Создаем редактируемый список пользователей с возможностью добавить, удалить пользователя и редактировать имя каждого пользователя. xsl - шаблон:
| |
| − | <source lang="xml">
| |
| − | <xsl:template match="udata[@module='users'] and udata[@method='list_users']">
| |
| − | <ul umi:module="users" umi:method="list_users">
| |
| − | <xsl:apply-templates select="items/item" mode="viewuser">
| |
| − | </ul>
| |
| − | </xsl:template>
| |
| − | | |
| − | <xsl:template match="item" mode="viewuser">
| |
| − | <li umi:object-id="{@id}" umi:field-name="{fname}"><xsl:value-of select="document(concat('uobject://', @id, '.fname'))//value" /></li>
| |
| − | </xsl:template>
| |
| − | </source>
| |
| − | | |
| − | 3. Создаем редактируемое меню в tpl-шаблоне. Получаем возможность добавлять в меню страницы на любую вложенность, удалять страницы и изменять имена пунктов меню. Модифицируем шаблон /tpls/content/menu/default.tpl:
| |
| − | | |
| − | <source lang="php">
| |
| − | <?php
| |
| − | | |
| − | $FORMS = Array();
| |
| − | | |
| − | | |
| − | $FORMS['menu_block_level1'] = <<<END
| |
| − | <div id="menu" umi:element-id="%id%" umi:module="content" umi:method="menu">
| |
| − | %lines%
| |
| − | </div>
| |
| − | | |
| − | END;
| |
| − | | |
| − | $FORMS['menu_line_level1'] = <<<END
| |
| − | <a href="%link%" umi:element-id="%id%" umi:field-name="name">%text%</a>
| |
| − | | |
| − | END;
| |
| − | | |
| − | $FORMS['menu_line_level1_a'] = <<<END
| |
| − | <a class="active" href="%link%" umi:element-id="%id%" umi:field-name="name">%text%</a>
| |
| − | | |
| − | END;
| |
| − | | |
| − | | |
| − | ?>
| |
| − | </source>
| |
