Expand my Community achievements bar.

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;

}