Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Override the font face/family that is used for the RTE special chars

Avatar

Level 2

Hi All,

I am facing a problem with the special chars plugin - the issue is while authoring the content if I add any special character I am not able to differentiate the symbol because of the size. So i was trying to add custom css to the special characters so that they look bigger in size and are easily visible.

But the problem is I am not able to find the css class for the richtext component.

i checked it here - /libs/cq/gui/components/authoring/dialog/richtext/clientlibs/rte/coralui3 and few other places as well but couldn't find it.

Please can anyone provide me the css path where i can edit the classes or add custom classes.

OR

Is there any other way to increase the size of special chars in the RTE.Special chars size issue.png

1 Accepted Solution

Avatar

Correct answer by
Level 2

Hi Guys,

I got a solution.

Targeted the RTE class and included the custom CSS.

.cq-RichText-editable p {

  font-size: 15px;

  line-height: 1;

  font-family: sans-serif;

}

View solution in original post

3 Replies

Avatar

Level 10

You should localize this modification at project level. Add the custom style(s) to your project's less/css files and whenever your project's content pages are loaded in author, it would trigger on dialog-load.

Avatar

Level 2

Hi Gaurav,

Thanks for the quick response.

I can do what you have suggested but the problem is I just want to increase the special characters size. Issue is how to target only the special chars in the editor.

Avatar

Correct answer by
Level 2

Hi Guys,

I got a solution.

Targeted the RTE class and included the custom CSS.

.cq-RichText-editable p {

  font-size: 15px;

  line-height: 1;

  font-family: sans-serif;

}