This is a migrated thread and some comments may be shown as answers.

RadEditor and DialogsCssFile changes skin class

1 Answer 47 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Colin
Top achievements
Rank 1
Colin asked on 02 Feb 2018, 09:17 AM

Hello,

I am having an issue with RadEditor and the attribute DialogCssFile. I have previously posted this on stackoverflow, but have not yet got a reply. The basic question is

I have a Telerik RadEditor (2017.3.913.45) control with custom/unembedded skin (created using the themebuilder on telerik), and when I enter a value for the DialogsCssFile attribute, the markup of the page changes, meaning that my custom skin is not applied to the editor anymore.

Why is this a problem? Well the css inside the dialog for Find/replace for example didn't display correct, and having done some research, I needed to do some @imports into a customDialog.css file and drop that into the DialogsCssFile attribute.
As soon as I do this, the generated markup in the page for RadEditor changes from

Radeditor RadEditor_MyCustomSkin reWrapper

to

Radeditor MyCustomSkin reWrapper

meaning that my radeditor Skin is not applied to the editor, If I remove the DialogCssFile then the editor skin loads correctly, but the dialogs look wrong. In the Page source, the Window is a div within the page, and not an iFrame

Am I doing something wrong here?

 

For more detail, see my question on Stack Overflow:

https://stackoverflow.com/questions/48497461/telerik-radeditor-css-dialog-classes-overwriting-main-skin

 

1 Answer, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 02 Sep 2019, 03:19 PM

Hi Colin,

Thank you for reporting this issue!

To fix the DialogsCssFile problem please explicitly set the RenderMode property of RadEditor to "Lightweight", i.e.

 

        <telerik:RadEditor RenderMode="Lightweight"
            runat="server" ID="pageRadEdit" ToolbarMode="Default" EditModes="Design,Html"
            DialogsCssFile="~/assets/css/MyCustomSkin/DialogHandler.MyCustomSkin.css"
            ToolsFile="~/App_Data/Editor.xml" Width="980px" Height="800px"
            EnableResize="false" OnClientLoad="resizeMe" NewLineMode="P"
            OnClientSelectionChange="$page.setdirty"
            ContentFilters="DefaultFilters,ConvertFontToSpan,IECleanAnchors,OptimizeSpans,MozEmStrong,FixEnclosingP"
            EnableEmbeddedSkins="false">
            <SpellCheckSettings DictionaryLanguage="en-GB" AllowAddCustom="false" />
            <Languages>
                <telerik:SpellCheckerLanguage Code="en-GB" Title="English (UK)" />
            </Languages>
        </telerik:RadEditor>

 

Best Regards,
Rumen
Progress Telerik

Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Editor
Asked by
Colin
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Share this question
or