AEM 6.3 SP2 - Replace <b> with <strong> and <i> with <em> in Rich Text Editor

[silkyk66254620]

Hi All,

I want to replace <b> with <strong> and <i> with <em> in rte in AEM 6.3 SP2. I already tried below solutions but no luck as they all are for AEM 6.1.

1. Experiencing Adobe Experience Manager - Day CQ: AEM 61 - Touch UI Rich Text Editor Remove Bold and A...

2. Overriding '/libs/clientlibs/granite/richtext/core/js/commands/DefaultFormatting.js' with <b> to <strong>

3. Adding 'semanticMarkupMap' node in rte for changing of <b> to <strong>.

Whenever i author rte in dialog, it changes <b> to <strong> but the moment i click ok or 'view Source', it changes back to <b>.

Can you please provide some inputs?

[smacdonald2008]

Did you follow this article exactly - enter all of the plug-in code?

[smacdonald2008]

Also - we are checking with the author to see if there is an updated version of this article.

[PushparajanR]

We are also facing same issue. Any solution available now?

[silkyk66254620]

Yeah i did all the steps but still was not able to see the new Strong plugin. Can you provide any package or newer version of article specific to AEM 6.3?

[FredrickDominy]

I've had luck with adding this as a sibling to the RTE dialog's <uiSettings> and <rtePlugins> nodes.

<htmlRules jcr:primaryType="nt:unstructured">
  <docType jcr:primaryType="nt:unstructured">
  <typeConfig jcr:primaryType="nt:unstructured"
   useSemanticMarkup="{Boolean}true">
  <semanticMarkupMap
   b="strong"
   i="em"/>
  </typeConfig>
  </docType>
</htmlRules>

Note that if text has already been authored with <b> and <i> tags you will need to go in and add a space somewhere in the rte editor to pick up the change and swap the tags.

[cqcoder]

Fedrick,

<semanticMarkupMap
   b="strong"
   i="em"/>

shouldn't it be

<typeConfig jcr:primaryType="nt:unstructured"

   useSemanticMarkup="{Boolean}true">

  <semanticMarkupMap jcr:primaryType="nt:unstructured"

   b="strong"

   i="em"/>

</typeConfig>

not sure, how without jcr:primaryType="nt:unstructured" we can enter the value.

Please clarify.. I tried it as a node, but still not working... Im on AEM 6.4

[hibikik74610607]

I got the knowledge of this resolution from my colleague so I post the knowledge instead of my colleague.

The best practice is as follows in AEM6.4.

1. cq:editConfig

/apps/core/wcm/components/text/v2/text/cq:editConfig/cq:inplaceEditing/config/htmlRules/do cType/typeConfig

     @useSemanticMarkup [boolean] = true

/apps/core/wcm/components/text/v2/text/cq:editConfig/cq:inplaceEditing/config/htmlRules/d ocType/typeConfig/semanticMarkupMap

     @b [String] = "strong"

     @i [String] = "em"

2. cq:dialog

(a) Add a property "features" to rtePlugins/misctools node.

/apps/core/wcm/components/text/v2/text/cq:dialog/content/items/tabs/items/properties/items/columns/items/column/items/text/rtePlugins/misctools

     @features [String] = "*"

(b) Add misctools#sourceedit in "toolbar" properties of the below nodes.

/apps/core/wcm/components/text/v2/text/cq:dialog/content/items/tabs/items/properties/items/columns/items/column/items/text/uiSettings/cui/inline

/apps/core/wcm/components/text/v2/text/cq:dialog/content/items/tabs/items/properties/items/columns/items/column/items/text/uiSettings/cui/dialogFullScreen

(c) Create the following node structure and set properties same as "1. cq:editConfig".

/apps/core/wcm/components/text/v2/text/cq:dialog/content/items/tabs/items/properties/items/columns/items/column/items/text/htmlRules/docType/typeConfig

     @useSemanticMarkup [boolean] = true

/apps/core/wcm/components/text/v2/text/cq:editConfig/cq:inplaceEditing/config/htmlRules/d ocType/typeConfig/semanticMarkupMap

     @b [String] = "strong"

     @i [String] = "em"

Best,

[srikary71884977]

Hi hibikik39369812​,

i tried the above said thing but i am not able to get strong or em tags , infact the bold and italic tags are vanished from my dialog. Is there any other way to do it?

regards,

Srikar.Y

[Gaurav-Behl]

Could you share screenshots/steps that you performed? Do you see any errors in console log?

What version of AEM do you use?

[hibikik74610607]

Hi Srikar,

Which are you using the version of AEM?

I tried it on AEM6.4.

Best,

Hibiki

[mohammads598061]

works prefectly on AEM 6.4

[sarav_prakash]

This is really useful information. Its works sweet in AEM 6.4

[JakeCham]

Hi,

In 6.5 SP4, I have tried all the mentioned solutions without having success. If anyone got a solution in 6.5 sp please put it here.

[rk_pandian]

Hi @JakeCham ,

Can you pls try to refer/map the <htmlRules> node created to the respective RTE field in your dialog? because this helped me fix the issue in 6.5.

Let me know if it helps

<richTextContent
    jcr:primaryType="nt:unstructured"
    sling:resourceType="cq/gui/components/authoring/dialog/richtext"
    fieldDescription="Enter content to be displayed"
    fieldLabel="Rich text content"
    name="./richTextContent"
    useFixedInlineToolbar="{Boolean}true">
  <rtePlugins
      jcr:primaryType="nt:unstructured"
      sling:resourceSuperType="/apps/<path to config>/rtePlugins"/>
  <uiSettings
      jcr:primaryType="nt:unstructured"
      sling:resourceSuperType="/apps/<path to config>/uiSettings"/>
  <htmlRules
      jcr:primaryType="nt:unstructured"
      sling:resourceSuperType="/apps/<path to config>/htmlRules"/>

[Nirmal_Kumar1]

Hi pandian, 
Can you elaborate on the 

sling:resourceSuperType="/apps/<path to config>/htmlRules"/>

Which path to config here? 

[rk_pandian]

Hi @Nirmal_Kumar1,

Normally you would have a path in which you would have configured the RTE settings, for example pls see the first screenshot from @hibikik74610607 . So that path of that node should be mapped to the RTE field separately for rtePlugins, uiSettings and htmlRules. Hope this helps.

[Nirmal_Kumar1]

This fix worked, but it failed in situations like
<strong style="color:green">, where strong is changed to b but it omitted the style and class used inside it.
This happened for all cases whether it is changed from

• strong to b
• b to strong
• b to b
• strong to strong, the class and style used inside have been lost.

So working on a solution to fix this.

[rk_pandian]

Thanks for the update, good to hear that it is working, and pls post if you are able to sort out the color stuff. Unfortunately I didn't try that.