Populating RadEditor's Apply CSS Class dropdown with custom styles

HOW-TO 
Populate RadEditor's Apply CSS Class dropdown with custom styles.


SOLUTION
Telerik RadEditor uses the same CSS files as the default rich-text editor. Those files are HtmlEditorTableFormats.css and HtmlEditorCustomStyles.css, which are located in the following folder:
/Program Files/Common Files/Microsoft Shared/web server extensions/12/Template/Layouts/1033/Styles 
By modifying these CSS files you can add, edit, and delete CSS styles which are displayed in the "Apply CSS class" dropdown, but in many scenarios it is wanted to populate the Apply CSS Class dropdown with an entirely new set of CSS Classes.


RadEditor for MOSS v.4.x.x:

You can easily achieve this by isolating the desired CSS Classes in a new CSS file ( for example CustomCssFile.css) and setting the editor's CssFiles property to point to the new CSS file CustomCssFile.css.

Depending on your scenario Web Part and WCM / SharePoint forms scenario (Lists, Wikis, Blogs, etc.) you have to modify the ConfigFile.xml / ListConfigFile.xml, which is located in the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/4.x.x.0__1f131a624888eeed/RadControls/Editor/ folder like follows:

< property name = "CssFiles">

< item > /_wpresources/RadEditorSharePoint/CustomCssFile.css </ item >

</ property >

In addition to this, the following help articles will be in help:

• Defining custom CSS styles
• Set Properties Via Config File 

RadEditor for MOSS v.5.x.x:

You can easily achieve this by isolating the desired CSS Classes in a new CSS file ( for example CustomCssFile.css) and setting the editor's CssFiles property to point to the new CSS file CustomCssFile.css.

Depending on your scenario Web Part and WCM / SharePoint forms scenario (Lists, Wikis, Blogs, etc.) you have to modify the ToolsFile.xml / ListToolsFile.xml, which is located in the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/5.x.x.0__1f131a624888eeed/Resources/ folder like follows:

<root>

...........

<cssFiles>

<item name="/_wpresources/RadEditorSharePoint/CustomCssFile.css " />

</cssFiles>

..........

</root>

In addition to this, the following help articles will be in help:

• Defining custom CSS styles
• Add/Remove tools from the toolbar