Добавление стилей в богатый текст Touch ui multifield

Question

Я пытался создать текстовый компонент с текстом mififield в AEM 6.2. Я создал его, добавив поле со следующим типом ресурса:

<test 
    jcr:primaryType="nt:unstructured" 
    sling:resourceType="cq/gui/components/authoring/dialog/richtext" 
    fieldLabel="Touch Ui Text" 
    name="./test" 
    renderReadOnly="{Boolean}true"/> 

Это worked.But я должен добавить стили как плагин в моем текстовом компоненте mutifield, который я не могу сделать. Как добавить плагины так же, как добавить плагины rte в классическом ui? Мне нужно предоставить различные стили в богатом текстовом редакторе, как часть multifield.

Спасибо за помощь!

Answer 1

Появляется возможность использования пользовательских стилей в редакторе Rich Text Editor: removed in Touch UI, as per the AEM 6.0 documentation.

Этого плагин комбинаций/Функции не поддерживается с сенсорным оптимизированным пользовательским интерфейсом:

• редактировать
• изображений
• sourceedit
• стили
• таблица

К счастью, они вернулись в AEM 6.2. Я не уверен около 6.1, они, вероятно, также поддерживаются.

Документация для AEM 6.2 describes the steps necessary to enable the Styles RTE Plugin. Мне потребовалось много чтения, но мне удалось получить плагин Стили.

В пути к TL; DR я могу только сказать, что конфигурация стилей имеет тот же формат, как и в случае классического интерфейса, и вы также должны обратить внимание на uiSettings для компонента, как они управляют видимостью кнопок в сенсорном интерфейсе.

Вот пример конфигурации поля (остальная часть cq:dialog опущена для краткости:.

<text jcr:primaryType="nt:unstructured" 
     name="./text" 
     sling:resourceType="cq/gui/components/authoring/dialog/richtext" 
     useFixedInlineToolbar="true"> 
    <rtePlugins jcr:primaryType="nt:unstructured"> 
     <format jcr:primaryType="nt:unstructured" features="*"/> 
     <justify jcr:primaryType="nt:unstructured" features="*"/> 
     <lists jcr:primaryType="nt:unstructured" features="*"/> 
     <links jcr:primaryType="nt:unstructured" features="*"/> 
     <styles jcr:primaryType="nt:unstructured" features="styles"> 
      <styles jcr:primaryType="cq:WidgetCollection"> 
       <warning jcr:primaryType="nt:unstructured" cssName="warning" text="Warning"/> 
       <note jcr:primaryType="nt:unstructured" cssName="note" text="Note"/> 
       <header jcr:primaryType="nt:unstructured" cssName="header" text="Header"/> 
      </styles> 
     </styles> 
     <paraformat jcr:primaryType="nt:unstructured" features="*"> 
      <formats jcr:primaryType="cq:WidgetCollection"> 
       <paragraph jcr:primaryType="nt:unstructured" description="Paragraph" tag="p"/> 
       <heading1 jcr:primaryType="nt:unstructured" description="Heading 1" tag="h1"/> 
      </formats> 
     </paraformat> 
    </rtePlugins> 
    <uiSettings jcr:primaryType="nt:unstructured"> 
     <cui jcr:primaryType="nt:unstructured"> 
      <inline jcr:primaryType="nt:unstructured"> 
       <popovers jcr:primaryType="nt:unstructured"> 
        <justify jcr:primaryType="nt:unstructured" ref="justify"/> 
        <lists jcr:primaryType="nt:unstructured" ref="lists"/> 
        <paraformat jcr:primaryType="nt:unstructured" items="paraformat:getFormats:paraformat-pulldown" ref="paraformat"/> 
        <styles jcr:primaryType="nt:unstructured" items="styles:getStyles:styles-pulldown" ref="styles"/> 
       </popovers> 
      </inline> 
     </cui> 
    </uiSettings> 
</text> 

Примечание элементы в text/rtePlugins/styles и text/uiSettings/cui/inline/popovers/styles

Вот как это выглядит на странице:

Answer 2

Добавить

<rtePlugins jcr:primaryType="nt:unstructured"> 
    <styles 
           jcr:primaryType="nt:unstructured" 
           features="*"> 
     <styles jcr:primaryType="cq:WidgetCollection"> 
      <style1 
             jcr:primaryType="nt:unstructured" 
             cssName="style1" 
             text="style1"/> 
      <style2 
             jcr:primaryType="nt:unstructured" 
             cssName="style2" 
             text="style2"/> 
      <section--title> 
      </styles> 
     </styles> 
    </rtePlugins>