We are evaluating Rad Editor (version 5) for MOSS. We have a custom theme for our site and after using the Rad Editor, we noticed that the styles are not the same as our theme. What my end result is that when ever a user adds this webpart to their site, and adds content, the fonts and styles would be the same fonts as our custom theme. I have read the documentation at http://www.telerik.com/support/kb/aspnet-ajax/sharepoint/populating-radeditor-s-apply-css-class-dropdown-with-custom-styles.aspx and followed these instructions, but it seems that when I add content to the page it does not follow the new CSS file that I created at /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/custom.css. I added this to my toolsfile.xml
| <cssFiles> |
| <item name="/_wpresources/Custom.css " /> |
| </cssFiles> |
It looks like its still referencing HtmlEditorTableFormats.css and HtmlEditorCustomStyles.css.
Again, my end result would be that when a user adds content to this webpart it would use our theme css file. I just downloaded this webpart and haven't had much time to play with it.
5 Answers, 1 is accepted
Review the following online help article: Defining custom CSS styles.
If after checking the help you still have problems with setting styles in the content area, send me the ConfigFile.xml, ToolsFile.xml, ListConfigFile.xml, ListToolsFile.xml, CssEditor.css (if you decide to make one) files, which are located in the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/5.x.x.0__1f131a624888eeed/Resources/ folder. You can also send me the Custom.css. I will review them and advice you further.
Greetings,
Stanimir
the Telerik team
Rank 1
I looked at the documentation and after reading through it, I don't want to give the users the ability to change the CSS from the drop down. Perhaps the paragraph drop downs are best to use for what I am looking for:
When the user types in content, I want the default font to be Tahoma and color #454545 and with a size of 8pt. From here if the user needs to change the look and feel of the content, the can select the paragraph drop down to select H1, H2, etc. However I still need some type of CSS formatting to follow for links and bullets. I guess the real question is, does the editor follow this external css file by default or does the user have to select it?
I also noticed that when typing content everything is black, but after selecting OK or Apply, the fonts change. I have included some attachments.
Config File:
==============================================================================================
Config File valid structure:
<configuration>
<property>...</property>
...
<property>
<item>...</item>
<item>...</item>
...
</property>
...
</configuration>
===============================================================================================
--> ToolsFile:
LISTCONFIG:
==============================================================================================
Config File valid structure:
<configuration>
<property>...</property>
...
<property>
<item>...</item>
<item>...</item>
...
</property>
...
</configuration>
===============================================================================================
--> LISTTOOLS:
There is no need to specify the cssFiles collection in the ToolsFile.xml if you are setting CssEditor.css. so remove the following element:
<cssFiles> <item name="/_wpresources/RadEditorSharePoint/5.8.7.0__1f131a624888eeed/Resources/CSSEditor.css" /></cssFiles>Also send me CssEditor.css content. I will review it and advise you further.
As for the images. I can tell that different styling is loaded in the page and in the editor's content are. You need to make sure that the same styling is loaded in both of them.
Kind regards,
Stanimir
the Telerik team
Rank 1
body{
background-color:#FFFFFF;
font-family:verdana,arial,helvetica,sans-serif;
color:#454545;
}
.ms-WPBody P {
font:normal 8.5pt "Tahoma" !important;
color:#454545;
text-align:left;
}
.ms-WPBody
{
font-size:8.5pt;
/*font-family:verdana,arial,helvetica,sans-serif;*/
font-family:tahoma,verdana;
color:#454545;
}
.ms-WPBody A:link {
color:#003399;
text-decoration:none;
font-weight:bold;
}
.ms-WPBody A:visited
{
color:#4c4c4c;
text-decoration:none;
font-weight:bold;
}
.ms-WPBody A:hover
{
color:#000000;
text-decoration:none;
font-weight:bold;
}
I created a small video where you can see how the styling in the page where the editor is loaded differs with the styling in the content area: http://screencast.com/t/vGFRgWlhMhEw. If I wanted to be the same I had to add the CssEditor.css in the master page for example.
Regards,
Stanimir
the Telerik team