Question

我试图在AEM 6.2中创建一个多字段触摸ui文本组件。我通过添加具有以下资源类型的字段来创建它：

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

它工作。但我必须在我的mutifield文本组件中添加样式作为插件，我无法做到。如何添加插件就像我们在经典ui中添加rte插件一样？我需要在富文本编辑器中提供各种样式作为multifield的一部分。

感谢您的帮助！

Answer 1

在富文本编辑器中使用自定义样式的选项似乎是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 的方式，我只能说样式配置遵循与经典UI相同的格式，并且您还需要注意uiSettings对于您的组件，因为它们可以在Touch UI中提升按钮的可见性。

这是一个示例字段配置（为了简洁省略了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>

在富文本中添加样式触摸ui multifield

2 个答案: