Issue with multiple RTE

[burhanuddinj]

Multiple RTE fields with different editing options is not working.

For ex- On one page, we have 2 different components with RTE's. Each has different editing options. But whichever component is opened first, the same options are seen in another RTE as well.

[ShivamKumar]

Hi @burhanuddinj ,

AEM reuses RTE config globally. When RTE fields have the same node name (like text) or lack unique config scopes, the toolbar leaks across components.

You can try following solutions - 

• Use different RTE field names in dialogs
  • e.g., ./overview, ./details (not both ./text)
• Use unique dialog node names
  • e.g., <rteOverview> and <rteDetails>
• Do NOT use shared configPath

You can refer below xml - 

<!-- Component A -->
<rteOverview
  jcr:primaryType="nt:unstructured"
  sling:resourceType="cq/gui/components/authoring/dialog/richtext"
  name="./overview"
  features="[bold,italic]" />

<!-- Component B -->
<rteDetails
  jcr:primaryType="nt:unstructured"
  sling:resourceType="cq/gui/components/authoring/dialog/richtext"
  name="./details"
  features="[underline,subscript]" />

Let me know if this works.
 

[burhanuddinj]

Hi @ShivamKumar ,

Thanks for your response, but it did not work. Below is my rte config

RTE 1

<listitemlabel
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
features="[underline,subscript]"
fieldDescription="Provide a label for the list item"
fieldLabel="List item label"
name="./itemlabel"
removeSingleParagraphContainer="{Boolean}true"
useFixedInlineToolbar="{Boolean}true"/>

RTE 2

<byline
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
features="[bold,italic]"
fieldDescription="Provide a byline"
fieldLabel="Byline"
name="./byline"
useFixedInlineToolbar="{Boolean}true"/>

[ShivamKumar]

Hey, I think the problem is occurring because of useFixedInIn AEM, when using useFixedInlineToolbar=true, the RTE toolbar config is cached and reused across fields, unless additional isolation is enforced.

Try this -

Use Distinct uiSettings to Isolate Toolbars
Embed explicit toolbar configurations under each field like this:- 

<listitemlabel
  jcr:primaryType="nt:unstructured"
  sling:resourceType="cq/gui/components/authoring/dialog/richtext"
  name="./itemlabel"
  fieldLabel="List item label"
  useFixedInlineToolbar="{Boolean}true">
  <uiSettings jcr:primaryType="nt:unstructured">
    <cui jcr:primaryType="nt:unstructured">
      <inline jcr:primaryType="nt:unstructured">
        <toolbar jcr:primaryType="nt:unstructured">
          <items jcr:primaryType="nt:unstructured">
            <underline jcr:primaryType="nt:unstructured"/>
            <subscript jcr:primaryType="nt:unstructured"/>
          </items>
        </toolbar>
      </inline>
    </cui>
  </uiSettings>
</listitemlabel>



<byline
  jcr:primaryType="nt:unstructured"
  sling:resourceType="cq/gui/components/authoring/dialog/richtext"
  name="./byline"
  fieldLabel="Byline"
  useFixedInlineToolbar="{Boolean}true">
  <uiSettings jcr:primaryType="nt:unstructured">
    <cui jcr:primaryType="nt:unstructured">
      <inline jcr:primaryType="nt:unstructured">
        <toolbar jcr:primaryType="nt:unstructured">
          <items jcr:primaryType="nt:unstructured">
            <bold jcr:primaryType="nt:unstructured"/>
            <italic jcr:primaryType="nt:unstructured"/>
          </items>
        </toolbar>
      </inline>
    </cui>
  </uiSettings>
</byline>

• Embedding uiSettings per field isolates toolbar definitions, stopping AEM’s global cache from overlapping.
• useFixedInlineToolbar avoids multiple RTE instances colliding and ensures consistent behavior.