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

css doesn't load when customizing toolbar items

1 Answer 88 Views

Editor

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

TazDeveloper asked on 01 Aug 2011, 09:27 PM

I have been trying to get CSS styles to load into a RadEditor with no luck. The editor needs to show image manger, unordered list, indent, outdent and Apply Styles. I was going nuts thinking it was something in my code, so I created a new Telerik Web Application. My test app only has the default page that is created when you do new project. I placed a RadEditor on the page and included my CSS stylesheet linked on the page.

The problem is that when the tools are changed/added, the stylesheet does not load. I am not even writing any code, I am letting the configuration manager put the changes into the file. See code below...

Is this a bug, or do I need to do something special?

Thanks,
Paul

When the apsx page contains the following the Apply Styles works great:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />

<link href="css/style.css" rel="stylesheet" type="text/css" />

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<telerik:RadSkinManager ID="RadSkinManager1" Runat="server" Skin="Hay">

</telerik:RadSkinManager>

<div>

<telerik:RadEditor ID="RadEditor1" Runat="server">

</telerik:RadEditor>

</div>

</form>

</body>

</html>

When I customize the toolbar and the code looks like this, I get no dropdown for the Apply Styles.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

<title></title>

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />

<link href="css/style.css" rel="stylesheet" type="text/css" />

</head>

<body>

<form id="form1" runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">

<Scripts>

<%--Needed for JavaScript IntelliSense in VS2010--%>

<%--For VS2008 replace RadScriptManager with ScriptManager--%>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />

</Scripts>

</telerik:RadScriptManager>

<script type="text/javascript">

//Put your JavaScript code here.

</script>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

</telerik:RadAjaxManager>

<telerik:RadSkinManager ID="RadSkinManager1" Runat="server" Skin="Hay">

</telerik:RadSkinManager>

<div>

<telerik:RadEditor ID="RadEditor1" Runat="server">

<Tools>

<telerik:EditorToolGroup Tag="MainToolbar">

<telerik:EditorTool Name="Print" ShortCut="CTRL+P" />

<telerik:EditorTool Name="AjaxSpellCheck" />

<telerik:EditorTool Name="FindAndReplace" ShortCut="CTRL+F" />

<telerik:EditorTool Name="SelectAll" ShortCut="CTRL+A" />

<telerik:EditorTool Name="Cut" />

<telerik:EditorTool Name="Copy" ShortCut="CTRL+C" />

<telerik:EditorTool Name="Paste" ShortCut="CTRL+V" />

<telerik:EditorToolStrip Name="PasteStrip">

</telerik:EditorToolStrip>

<telerik:EditorSeparator />

<telerik:EditorSplitButton Name="Undo">

</telerik:EditorSplitButton>

<telerik:EditorSplitButton Name="Redo">

</telerik:EditorSplitButton>

</telerik:EditorToolGroup>

<telerik:EditorToolGroup Tag="InsertToolbar">

<telerik:EditorTool Name="ImageManager" ShortCut="CTRL+G" />

<telerik:EditorTool Name="DocumentManager" />

<telerik:EditorTool Name="FlashManager" />

<telerik:EditorTool Name="MediaManager" />

<telerik:EditorTool Name="TemplateManager" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="LinkManager" ShortCut="CTRL+K" />

<telerik:EditorTool Name="Unlink" ShortCut="CTRL+SHIFT+K" />

</telerik:EditorToolGroup>

<telerik:EditorToolGroup>

<telerik:EditorTool Name="Superscript" />

<telerik:EditorTool Name="Subscript" />

<telerik:EditorTool Name="InsertParagraph" />

<telerik:EditorTool Name="InsertGroupbox" />

<telerik:EditorTool Name="InsertHorizontalRule" />

<telerik:EditorTool Name="InsertDate" />

<telerik:EditorTool Name="InsertTime" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="FormatCodeBlock" />

</telerik:EditorToolGroup>

<telerik:EditorToolGroup>

<telerik:EditorDropDown Name="FormatBlock">

</telerik:EditorDropDown>

<telerik:EditorDropDown Name="FontName">

</telerik:EditorDropDown>

<telerik:EditorDropDown Name="RealFontSize">

</telerik:EditorDropDown>

</telerik:EditorToolGroup>

<telerik:EditorToolGroup>

<telerik:EditorTool Name="AbsolutePosition" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="Bold" ShortCut="CTRL+B" />

<telerik:EditorTool Name="Italic" ShortCut="CTRL+I" />

<telerik:EditorTool Name="Underline" ShortCut="CTRL+U" />

<telerik:EditorTool Name="StrikeThrough" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="JustifyLeft" />

<telerik:EditorTool Name="JustifyCenter" />

<telerik:EditorTool Name="JustifyRight" />

<telerik:EditorTool Name="JustifyFull" />

<telerik:EditorTool Name="JustifyNone" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="Indent" />

<telerik:EditorTool Name="Outdent" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="InsertOrderedList" />

<telerik:EditorTool Name="InsertUnorderedList" />

<telerik:EditorSeparator />

<telerik:EditorTool Name="ToggleTableBorder" />

<telerik:EditorTool Name="XhtmlValidator" />

</telerik:EditorToolGroup>

<telerik:EditorToolGroup>

<telerik:EditorSplitButton Name="ForeColor">

</telerik:EditorSplitButton>

<telerik:EditorSplitButton Name="BackColor">

</telerik:EditorSplitButton>

<telerik:EditorDropDown Name="ApplyClass">

</telerik:EditorDropDown>

<telerik:EditorToolStrip Name="FormatStripper">

</telerik:EditorToolStrip>

</telerik:EditorToolGroup>

<telerik:EditorToolGroup Tag="DropdownToolbar">

<telerik:EditorSplitButton Name="InsertSymbol">

</telerik:EditorSplitButton>

<telerik:EditorToolStrip Name="InsertTable">

</telerik:EditorToolStrip>

<telerik:EditorToolStrip Name="InsertFormElement">

</telerik:EditorToolStrip>

<telerik:EditorSplitButton Name="InsertSnippet">

</telerik:EditorSplitButton>

<telerik:EditorTool Name="ImageMapDialog" />

<telerik:EditorDropDown Name="InsertCustomLink">

</telerik:EditorDropDown>

<telerik:EditorSeparator />

<telerik:EditorTool Name="ConvertToLower" />

<telerik:EditorTool Name="ConvertToUpper" />

<telerik:EditorSeparator />

<telerik:EditorDropDown Name="Zoom">

</telerik:EditorDropDown>

<telerik:EditorSplitButton Name="ModuleManager">

</telerik:EditorSplitButton>

<telerik:EditorTool Name="ToggleScreenMode" ShortCut="F11" />

<telerik:EditorTool Name="AboutDialog" />

</telerik:EditorToolGroup>

</Tools>

<Content>

</Content>

</telerik:RadEditor>

</div>

</form>

</body>

</html>

1 Answer, 1 is accepted

Accepted