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

Editor Icons dissapear

6 Answers 39 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Hans van Rijnswoud
Top achievements
Rank 2
Hans van Rijnswoud asked on 17 Jul 2009, 11:34 AM
I want to apply a custom stylesheet to the Radeditor for appearence and therefore I copied an example stylesheet and the images to a specific folder and tried to apply my custom stylesheet. Also I set NO skin to the radeditor and I set EnableEmbeddedSkins to false.

I can now style the RadEditor but the only thing not working are the icons, they do not appear. I tried templates of several skins of telerik but only the icons do not work. I tried several thins with placing the CommandSprites.png etc but it does not seam to work.

We have used this method of styling for other Rad tools and there it worked perfect.

Must i do something special to make the icons work?

Someone any Idea? Thanks

6 Answers, 1 is accepted

Sort by
0
Hans van Rijnswoud
Top achievements
Rank 2
answered on 17 Jul 2009, 11:37 AM
Forgot to tell I use the Q1 2009 version of RadEditor
0
Accepted
Martin
Telerik team
answered on 17 Jul 2009, 12:50 PM
Hi Edwin Blom,

The fact that the skin appears fine makes me think that the problem has something to do with Editor.css, where the coordinates of the icons are stored, or with the image sprites theirselves. The icon sprites are 4 similar files. The ones that are postfixed with Dark are antialiased for dark skins, the ones with Light are supposed for light skins. The sprites that are postfixed with IE6 are for IE6, as IE6 does not support png transparency, so we switch to .gif:

CommandSpritesDark.png
CommandSpritesDarkIE6.gif
CommandSpritesLight.png
CommandSpritesLightIE6.gif

Make sure that:

1. Editor.css is registered in the <head /> of the webpage if you have set EnableEmbeddedBaseStylesheet to true
2. All 4 image sprites are included in the project, and their file paths are correct, i.e. Common/CommandSpritesDark.png

If you continue experiencing the problem after you have checked the above two considerations, open a new support ticket and send us a small running project that contains RadEditor with your custom skin, and we will do our best to help.

Also, can you throw some light on the following sencetnce, because we are not sure we understand it:

"Also I set NO skin to the radeditor and I set EnableEmbeddedSkins to false."

Have a great weekend,
Martin Ivanov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Hans van Rijnswoud
Top achievements
Rank 2
answered on 12 Aug 2009, 11:38 AM
Hi Martin Ivanov,

Sorry for my late answer. To busy;-)
Thanks for your answer. I try to implement but it's no possible to see the CommandSpritesLight of Dark on the editor.
Also i found strange when i take a look in firefox in the option Tools/PageInfo/Media. I see in the list all image of the editor but not the CommandSprites.



For more information here is the definition of my editor:
     <telerik:RadEditor runat="server" ID="reded_Editor" Width="570px"   
                                ContentAreaCssFile="~/CssStyleSheets/ContentEditor.css"   
                                EnableEmbeddedBaseStylesheet="true"  EnableEmbeddedSkins="false">  
                                            <Tools>
                                               <telerik:EditorToolGroup> 
                                                    <telerik:EditorTool Name="Print" /> 
                                                    <telerik:EditorTool Name="FindAndReplace" /> 
                                                    <telerik:EditorTool Name="SelectAll" /> 
                                                    <telerik:EditorTool Name="Cut" /> 
                                                    <telerik:EditorTool Name="Copy" /> 
                                                    <telerik:EditorTool Name="PasteFromWordNoFontsNoSizes" /> 
                                                    <telerik:EditorTool Name="Undo" /> 
                                                    <telerik:EditorTool Name="Redo" /> 
                                                </telerik:EditorToolGroup> 
                                                <telerik:EditorToolGroup> 
                                                    <telerik:EditorTool Name="LinkManager" Text="Link definieren" /> 
                                                    <telerik:EditorTool Name="Unlink" Text="link verwijderen" /> 
                                                </telerik:EditorToolGroup> 
                                                <telerik:EditorToolGroup> 
                                                    <telerik:EditorTool Name="ToggleScreenMode" Text="Volledig scherm" ShortCut="F11" /> 
                                                    <telerik:EditorTool Name="Zoom" Text="Inzoomen" /> 
                                                </telerik:EditorToolGroup> 
                                                <telerik:EditorToolGroup> 
                                                    <telerik:EditorTool Name="FontName" Text="Lettertype" /> 
                                                    <telerik:EditorTool Name="FontSize" Text="Formaat lettertype" /> 
                                                    <telerik:EditorTool Name="ForeColor" Text="Kleur lettertype" /> 
                                                    <telerik:EditorTool Name="Bold" Text="Dikgedrukt" /> 
                                                    <telerik:EditorTool Name="Italic" Text="Cursief" /> 
                                                    <telerik:EditorTool Name="Underline" Text="Onderstrepen" /> 
                                                    <telerik:EditorTool Name="JustifyLeft" Text="Links uitlijnen" /> 
                                                    <telerik:EditorTool Name="JustifyCenter" Text="Centreren" /> 
                                                    <telerik:EditorTool Name="InsertUnorderedList" Text="Opsommingstekens" /> 
                                                </telerik:EditorToolGroup> 
                                            </Tools> 
                                            <Content> 
                                            </Content> 
                                        </telerik:RadEditor> 


And here my css file ( this file is wel defined on the head of the page)

    _margin: 0 !important;  



In advance thanks for your help.
0
Martin
Telerik team
answered on 12 Aug 2009, 11:44 AM
Hello Edwin Blom,

I think it will be best if you open a new support ticket, and send me a small running project where the issue can be observed locally, and believe I will be able to fix this for you.

Kind regards,
Martin Ivanov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Hans van Rijnswoud
Top achievements
Rank 2
answered on 12 Aug 2009, 11:54 AM
Hi Martin Ivanov

Sorry, i just found the solution.
In the Telerik css we have background:url('png');
I relpace this png by my path to the CommandSprites and it's working now.

My aplogice for this and thanks again for your help.

Edwin.

PS: FYI, when i want to inlcude the css code in my message on your forum i received a javascript error script to kill the script.
0
Martin
Telerik team
answered on 12 Aug 2009, 12:06 PM
Hello Edwin Blom,

Yes, I just remembered that we had such issue with incorrect url for the background image for the command sprite in the uncomplied skins, and I am sorry you have encountered it as well. However, it is already fixed, and if you upgrade in the future you will not have any problems with external skins. But - if you do, just have in mind that we are here to help.

Greetings,
Martin Ivanov
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Editor
Asked by
Hans van Rijnswoud
Top achievements
Rank 2
Answers by
Hans van Rijnswoud
Top achievements
Rank 2
Martin
Telerik team
Share this question
or