Hi All,
Initially I like to include a rich text editor in a container within a component, but it fails to show up. So I just include a regular auto-generated text component, which is located at "mysite/components/content/text". This seems to be for all projects using maven archetype and I take for granted that it works.
Here is the component xml
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:granite="http://www.adobe.com/jcr/granite/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
jcr:primaryType="nt:unstructured"
jcr:title="Nav Config"
sling:resourceType="cq/gui/components/authoring/dialog"
extraClientlibs="[core.wcm.components.navigation.v1.editor]"
>
<content
granite:class="cmp-navigation__editor"
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<tabs
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/tabs"
maximized="{Boolean}true">
<items jcr:primaryType="nt:unstructured">
<textheading
jcr:primaryType="nt:unstructured"
id="nav-heading-text"
title="Heading & Text"
jcr:title="Heading & Text"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<heading
jcr:primaryType="nt:unstructured"
fieldLabel="Heading"
name="./heading"
sling:resourceType="granite/ui/components/foundation/form/textfield"/>
<text
jcr:primaryType="nt:unstructured"
fieldLabel="Body"
name="./text" sling:resourceType="mysite/components/content/text">
</text>
</items>
</textheading>
</items>
</tabs>
<items>
</content>
</jcr:root>
Looking at the bold text xml, the "Heading" and its field show up on the component, but not the "Body".
If I change the sling:resourceType to "mysite/components/content/separator", I can see the separator, and only this one works, others such as image, title, etc. don't.
The mysite/component/content/text/.content.xml is:
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
jcr:primaryType="cq:Component"
jcr:title="Text"
sling:resourceSuperType="core/wcm/components/text/v2/text"
componentGroup="Mysite.Content"/>
Can someone please help?
thanks!
-kt
Views
Replies
Total Likes
I think you are confused with the file names.
The /component/path/.content.xml is meant to be the component definition, you cannot add dialog code in there.
The /component/path/_cq_dialog/.content.xml is meant to be the dialog's definition.
That being said, I think you could potentially use the RTE in the dialog instead of trying to embed the text component, simply use in the dialog definition something like this:
<richTextEditor
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
name="./text">
I may explain it in an unclear way. The component xml is actually in _cq_dialog/.content.xml, something like this:
mysite/components/navigation/_cq_dialog/.content.xml
<xml...>
<jcr:root..>
<content ...>
<item>
<richTextEditor jcr:primaryType="nt:unstructured" sling:resourceType="cq/gui/components/authoring/dialog/richtext" name="./text">
</item>
</content>
</jcr:root>
The RTE doesn't show up.
<items jcr:primaryType="nt:unstructured">
<heading
jcr:primaryType="nt:unstructured"
fieldLabel="Heading"
name="./heading"
sling:resourceType="granite/ui/components/foundation/form/textfield"/>
<text
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
name="./text"
useFixedInlineToolbar="{Boolean}true"
>
<rtePlugins jcr:primaryType="nt:unstructured">
<format jcr:primaryType="nt:unstructured" features="bold,italic"/>
</rtePlugins>
<uiSettings jcr:primaryType="nt:unstructured">
<cui jcr:primaryType="nt:unstructured">
<inline jcr:primaryType="nt:unstructured"
toolbar="[format#bold,format#italic,format#underline,links#modifylink,links#unlink]">
</inline>
<icons jcr:primaryType="nt:unstructured">
<bold jcr:primaryType="nt:unstructured"
command="format#bold"
icon="textItalic"/>
</icons>
</cui>
</uiSettings>
</text>
<descp
jcr:primaryType="nt:unstructured"
fieldLabel="Description"
name="./description"
sling:resourceType="granite/ui/components/foundation/form/textfield"/>
</items>
I am attaching a screenshot here, showing the two text fields but not the RTE.
This configuration is working for me, can you compare it with yours?
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
xmlns:nt="http://www.jcp.org/jcr/nt/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
xmlns:granite="http://www.adobe.com/jcr/granite/1.0"
jcr:primaryType="nt:unstructured"
jcr:title="Text"
sling:resourceType="cq/gui/components/authoring/dialog">
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<tabs
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/tabs"
maximized="{Boolean}true">
<items jcr:primaryType="nt:unstructured">
<properties
jcr:primaryType="nt:unstructured"
jcr:title="Properties"
sling:resourceType="granite/ui/components/coral/foundation/container"
margin="{Boolean}true">
<items jcr:primaryType="nt:unstructured">
<columns
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns"
margin="{Boolean}true">
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
granite:class="cq-RichText-FixedColumn-column"
sling:resourceType="granite/ui/components/coral/foundation/container">
<items jcr:primaryType="nt:unstructured">
<text
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
name="./text"
useFixedInlineToolbar="{Boolean}true">
<rtePlugins jcr:primaryType="nt:unstructured">
<format
jcr:primaryType="nt:unstructured"
features="bold,italic"/>
<justify
jcr:primaryType="nt:unstructured"
features="-"/>
<links
jcr:primaryType="nt:unstructured"
features="modifylink,unlink"/>
<lists
jcr:primaryType="nt:unstructured"
features="*"/>
<misctools jcr:primaryType="nt:unstructured">
<specialCharsConfig jcr:primaryType="nt:unstructured">
<chars jcr:primaryType="nt:unstructured">
<default_copyright
jcr:primaryType="nt:unstructured"
entity="&copy;"
name="copyright"/>
<default_euro
jcr:primaryType="nt:unstructured"
entity="&euro;"
name="euro"/>
<default_registered
jcr:primaryType="nt:unstructured"
entity="&reg;"
name="registered"/>
<default_trademark
jcr:primaryType="nt:unstructured"
entity="&trade;"
name="trademark"/>
</chars>
</specialCharsConfig>
</misctools>
<paraformat
jcr:primaryType="nt:unstructured"
features="*">
<formats jcr:primaryType="nt:unstructured">
<default_p
jcr:primaryType="nt:unstructured"
description="Paragraph"
tag="p"/>
<default_h1
jcr:primaryType="nt:unstructured"
description="Heading 1"
tag="h1"/>
<default_h2
jcr:primaryType="nt:unstructured"
description="Heading 2"
tag="h2"/>
<default_h3
jcr:primaryType="nt:unstructured"
description="Heading 3"
tag="h3"/>
<default_h4
jcr:primaryType="nt:unstructured"
description="Heading 4"
tag="h4"/>
<default_h5
jcr:primaryType="nt:unstructured"
description="Heading 5"
tag="h5"/>
<default_h6
jcr:primaryType="nt:unstructured"
description="Heading 6"
tag="h6"/>
<default_blockquote
jcr:primaryType="nt:unstructured"
description="Quote"
tag="blockquote"/>
<default_pre
jcr:primaryType="nt:unstructured"
description="Preformatted"
tag="pre"/>
</formats>
</paraformat>
<table
jcr:primaryType="nt:unstructured"
features="-">
<hiddenHeaderConfig
jcr:primaryType="nt:unstructured"
hiddenHeaderClassName="cq-wcm-foundation-aria-visuallyhidden"
hiddenHeaderEditingCSS="cq-RichText-hiddenHeader--editing"/>
</table>
<tracklinks
jcr:primaryType="nt:unstructured"
features="*"/>
</rtePlugins>
<uiSettings jcr:primaryType="nt:unstructured">
<cui jcr:primaryType="nt:unstructured">
<inline
jcr:primaryType="nt:unstructured"
toolbar="[format#bold,format#italic,format#underline,#justify,#lists,links#modifylink,links#unlink,#paraformat]">
<popovers jcr:primaryType="nt:unstructured">
<justify
jcr:primaryType="nt:unstructured"
items="[justify#justifyleft,justify#justifycenter,justify#justifyright]"
ref="justify"/>
<lists
jcr:primaryType="nt:unstructured"
items="[lists#unordered,lists#ordered,lists#outdent,lists#indent]"
ref="lists"/>
<paraformat
jcr:primaryType="nt:unstructured"
items="paraformat:getFormats:paraformat-pulldown"
ref="paraformat"/>
</popovers>
</inline>
<tableEditOptions
jcr:primaryType="nt:unstructured"
toolbar="[table#insertcolumn-before,table#insertcolumn-after,table#removecolumn,-,table#insertrow-before,table#insertrow-after,table#removerow,-,table#mergecells-right,table#mergecells-down,table#mergecells,table#splitcell-horizontal,table#splitcell-vertical,-,table#selectrow,table#selectcolumn,-,table#ensureparagraph,-,table#modifytableandcell,table#removetable,-,undo#undo,undo#redo,-,table#exitTableEditing,-]">
</tableEditOptions>
</cui>
</uiSettings>
</text>
</items>
</column>
</items>
</columns>
</items>
</properties>
<cq:styles
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/coral/foundation/include"
path="/mnt/overlay/cq/gui/components/authoring/dialog/style/tab_edit/styletab"/>
</items>
</tabs>
</items>
</content>
</jcr:root>
Hi @EstebanBustamante ,
Thanks for your code. I just copied and pasted it onto the _cq_dialog/.content.xml, and it doesn't work for me. Don't know if there should be any clientlib associated with it?
see attached
-kt
Interesting, I just copy/pasted my code, and worked fine. Which version of AEM are you using? I see in your dialog another tab (which is not part of my code), Can you try to delete the whole thing from your _cq_dialog/.content.xml and copy my content? Then delete manually the component (or at least the dialog) from the AEM instance and re-install, I suspect your filter.xml may be merging oddly the_cq_dialog/.content.xml file.
The other tab actually is "cq:styles" from your code. My AEM is 6.5.11.0. I don't even remember what archetype is using, probably 22. I fine-tuned the archetype a lot of times until I got that one for various reasons.
This is the OOTB component /libs/cq/gui/components/authoring/dialog/richtext, as referred as sling:resourceType="cq/gui/components/authoring/dialog/richtext" in the dialog.
You may see all the nodes are created accordingly.
Try something of these:
- Use the text component from the Core components in your pages
- Drop your component into other templates/sites (wknd site may work due it has enabled the clientlibs)
- Inspect the dialog to check there is no custom code hiding the RTE field
- Check if you have any policy which could be messing with your component.
These can give you some insights if the issue is related to your template, site, clientlibs, or any other custom code, it seems the code i shared works just fine (i just double checked in wknd site), so it may be something specific to you
I will try that. I figure it can be the css issue, but I don't know how I can configure the css.
I started a new instance, and dropped a text component on a parsys. The OOTB Text component can display on both inline and popup modes.
But the OOTB Text component can only display the inline mode in another project, which has the issue of RTE.
Seems the textarea cannot show up due to the CSS, but am not sure yet.
-kt
Hi @EstebanBustamante ,
It looks like my instance fails to load the correct CSS properties for the component, the regular OOTB Text component suffers the same issue. If you don't mind, you can take a look at https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/text-component-can-t-be-lo....
Thanks a lot for your help!
Views
Like
Replies