ASPDotNetStorefront WYSIWYG Editor Styles

Est. Reading Time: 1 minute

Ever try to get the WYSIWYG editor styles to match up to the actual site in ASPDotNetStorefront?  Basically so that the site styles show within the editor as they would on the actual page. Links would be the same color and paragraphs would have the same padding/font size and so on.   With a lot of research and about an hour of aimlessly editing different style sheets I finally found a working solution.  You have to add the style sheet location to an XML config file.

The file to edit is located at \RadControls\Editor\ConfigFile.xml and the lines to edit will be at the very bottom.

Change this….

To something more like this…


***UPDATE: the above is for AspDotNetStorefront 8 for AspDotNetStorefront MS (9) see below:


By default, the RAD editor will just use whatever styles are available to that page, meaning the main skin CSS file. If you want to change to use another stylesheet again, you’ll have to do some code mods.
You’d need to edit the file where the RAD editor is added to the page (for example, entityEditProduct.aspx) and find the telerik:radeditor invocation, then add a CssFiles node like this:
<telerik:EditorCssFile Value="~/App_Themes/Skin_1/test.css" />


  1. david m
    Posted August 14, 2011 at 4:38 pm | Permalink

    ConfigFile.xml is not in RadControls/… because there is no such folder.

  2. Posted August 15, 2011 at 6:50 am | Permalink

    What version are you using? I should have specified this blog is referring to AspDotNetStorefront ML 8. I have updated the blog with instructions for AspDotNetStorefront MS. Let me know if they work out better for you.