Expand my Community achievements bar.

SOLVED

Rich Text Editor - Swap <i> element for <em>

Avatar

Level 4

Using an OSX/Chrome combination, I have specified the html rules - for use by my custom Rich Text Editor in the snippet at the foot of this question.  I've also provided an overridden copy of DefaultFormatting.js and specified the elements to use as shown in the snippet at the foot of this question.  While bold text is marked-up as I'd like (as strong elements), italic elements are only specified as em elements 'temporarily'.

  1. First time I highlight some text in the RTE and click on italic, the markup produced is 
    <p><em>Some text</em></p>
  2. If i close the RTE but then re-open it, the mark-up is changed to the unwanted
    <p><i>Some text</i></p>

Is this a known issue or have I missed some additional configuration?

 

<htmlRules jcr:primaryType="nt:unstructured"> <docType jcr:primaryType="nt:unstructured"> <typeConfig jcr:primaryType="nt:unstructured"> <semanticMarkupMap jcr:primaryType="nt:unstructured" b="strong" em="em" i="em" strong="strong"/> </typeConfig> </docType> </htmlRules>
/** snippet from /apps/cq/ui/rte/core/commands/DefaultFormatting.js * @private */ _getTagNameForCommand: function(cmd) { var cmdLC = cmd.toLowerCase(); var tagName = null; switch (cmdLC) { case "bold": tagName = "strong"; break; case "italic": tagName = "em"; break; case "underline": tagName = "u"; break; case "subscript": tagName = "sub"; break; case "superscript": tagName = "sup"; break; } return tagName; },
1 Accepted Solution

Avatar

Correct answer by
Level 10

Looks like the first time you use - it is using your overridden RTE (where you use em). Then it seems to use the one here:

/libs/cq/ui/rte/core/commands/DefaultFormatting.js

try making this small change in this file and see if it changes ( I typically do not like making changes under /libs. But this small change is minor.)

View solution in original post

2 Replies

Avatar

Correct answer by
Level 10

Looks like the first time you use - it is using your overridden RTE (where you use em). Then it seems to use the one here:

/libs/cq/ui/rte/core/commands/DefaultFormatting.js

try making this small change in this file and see if it changes ( I typically do not like making changes under /libs. But this small change is minor.)

Avatar

Level 4

Thanks @smacdonald2008 but as you'll see in my question (and the snippets of code i included) I've already overridden ('overlayed') the file that you suggested.  The thing that has me stumped here is I have made almost identical changes for the italic markup produced by the RTE as I have for bold.  While replacing <b> tags with <strong> works correctly and consistently, providing <em> tags instead of <i> doesn't quite.  Note: getting the bold shortcut key functionality to work correctly in the RTE wasn't straightforward and revealed the bug discussed here.