DotNetNuke: Getting fckEditor to use your site styles when editing

You may have noticed that when you edit text in DotNetNuke, what you see in the editor window may not look like what you see when you save your changes. This is because the fckEditor applies a different stylesheet in the editor window instead of any of the actual site css files. To change this, all you need to do is edit the web.config file for the site and set the proper value for the StaticCSSFile variable in the FckHtmlEditorProvider section.

So search your web.config for StaticCSSFile. And update it to point to your desired css file (e.g.  StaticCSSFile="~/Portals/0/Skins/MySkin/skin.css"). Save your changes and you should now see the proper styles when you edit content.

I initially tried making changes to the EditorAreaCSS variable in the fckconfig.js file as this is the standard place to make fckeditor changes but that proved to be a dead end. Not sure why the DNN folks implemented this in the web.config instead.