Apply css to CKEditor

Does anyone know how to apply css to the CKEditor WYSIWYG. I don't mean to provide the user with styling options, but rather to make the user experience look more like the front end styling.
LVL 16
s8webAsked:
Who is Participating?
 
abt-itConnect With a Mentor Commented:
Have a look at the fckconfig.js File of the FCK Editor.

---
FCKConfig.EditorAreaStyles = 'your.css';
---
Can be a single File or an array
---
FCKConfig.EditorAreaStyles = new Array('your.css', 'other.css');
---
0
 
jonahzonaCommented:
This shouldn't be a problem.

You simply need to know the classes of the form that is used. You may have to use a lot of !important values in order to override the given values.

If you look at the source code of your WYSISYG editor you should have no problem applying CSS styling to it.

If you need some more specific guidance, put up a link of the WYSIWYG editor so we can help.
0
 
abt-itConnect With a Mentor Commented:
CKEDITOR.editorConfig = function( config )
{
      // Define changes to default configuration here. For example:
      // config.language = 'fr';
      // config.uiColor = '#AADC6E';
      config.contentsCss = ['/css/styles.css', '/css/def_42.css'];
      
}
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.