Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

Editor / Setting Toolbars

1. Setting the tools in the RadEditor's declaration

   
 
 
 
 
   

2. Setting the tools via the ToolsFile property

   
  
 
 
   

3. Setting the tools programmatically in the codebehind

   
 
 
 
 
   

4. Setting the tools by using Theme

   
 
 
 
 
   

  • RadEditor provides 4 different ways to configurate the toolbars:

    1. Setting the tools in the RadEditor's declaration:
      <telerik:radeditor runat="server" ID="RadEditor1" Height="100px">
      <Tools>
      <telerik:EditorToolGroup >
      <telerik:EditorTool Name="Cut" />
      <
      telerik:EditorTool Name="Copy" />
      <
      telerik:EditorTool Name="Paste" />
      </
      telerik:EditorToolGroup>
      </Tools>
      </telerik:radeditor>
    2. Setting the tools via the ToolsFile property - the same way as in the previous versions of the control:
      <telerik:radeditor
      ToolsFile
      ="~/Editor/Examples/EditorToolbars/Tools.xml"
      runat
      ="server" ID="RadEditor2" Height="100px">
      </telerik:radeditor>
    3. Setting the tools programmatically in the codebehind:
      EditorToolGroup main = new EditorToolGroup();
      RadEditor3.Tools.Add(main);

      EditorTool body = new EditorTool();
      body.Name = "Bold";
      body.ShortCut = "CTRL+B";
      main.Tools.Add(body);

      EditorTool italic = new EditorTool();
      italic.Name = "Italic";
      italic.ShortCut = "CTRL+I";
      main.Tools.Add(italic);

      EditorTool underline = new EditorTool();
      underline.Name = "Underline";
      underline.ShortCut = "CTRL+U";
      main.Tools.Add(underline);
    4. Setting the tools by using Theme:
      In your .skin file:
      <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
      <telerik:radeditor runat="server" SkinId="SomeTools">
      <Tools>
      <telerik:EditorToolGroup >
      <telerik:EditorTool Name="Bold" />
      <
      telerik:EditorTool Name="Italic" />
      </
      telerik:EditorToolGroup>
      </Tools>
      </telerik:radeditor>
      Once the skin is set, you need to declare it in the RadEditor's declaration by using the SkinId property:
      <telerik:radeditor
      SkinID
      ="SomeTools"
      Height
      ="100px"
      runat
      ="server" ID="RadEditor4">
      </telerik:radeditor>

      Note: More information on how to use ASP.NET 2.x Themes is available in MSDN

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Theme="Default" Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.Editor.Default.DefaultCS" %>
    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <qsf:headtag id="Headtag1" runat="server"/>
        
    </head>
    <body class="BODY">
        <form id="form1" runat="server">
                             
            <qsf:header id="Header1" runat="server" navigationlanguage="c#"/>
         <telerik:RadScriptManager ID="ScriptManager1" runat="server" />
            
            <p style="clear: both; float: none;font-weight:bold;margin-top:25px;margin-bottom:10px;">
         1. Setting the tools in the RadEditor's declaration
         </p>    
            <telerik:radeditor runat="server" ID="RadEditor1" Height="250px">
               <Tools>
                <telerik:EditorToolGroup >
                    <telerik:EditorTool Name="Cut" />
                    <telerik:EditorTool Name="Copy" />
                    <telerik:EditorTool Name="Paste" />
                </telerik:EditorToolGroup>
               </Tools>    
               <Content>
                <img alt="product logo" src="../../Img/productLogoLight.gif" />is the successor of the well known industry standard Editor for ASP.NET. The tight integration with ASP.NET AJAX and the powerful new capabilities make Telerik's WYSIWYG Editor a flexible and lightweight component, turning it into the fastest loading Web Editor. Among the hottest features are:
         <ul>
                        <li><em>Single-file, drag-and-drop deployment</em></li>
                        <li><em>Built on top of ASP.NET AJAX</em></li>
                        <li><em>Unmatched loading speed with new semantic rendering </em></li>
                        <li><em>Full keyboard accessibility</em></li>
                        <li><em>Flexible Skinning mechanism</em></li>
                        <li><em>Simplified and intuitive toolbar configuration</em></li>
                        <li><em>Out-of-the-box XHTML-enabled output</em></li>
                        </ul>
               </Content>
              </telerik:radeditor>
             
              <p style="clear: both; float: none;font-weight:bold;margin-top:25px;margin-bottom:10px;">2. Setting the tools via the ToolsFile property</p>
        
              
              <telerik:radeditor
                ToolsFile="~/Editor/Examples/EditorToolbars/Tools.xml"
                runat="server" ID="RadEditor2" Height="250px">
                <Content>
                <img alt="product logo" src="../../Img/productLogoLight.gif" /> is the successor of the well known industry standard Editor for ASP.NET. The tight integration with ASP.NET AJAX and powerful new capabilities of the RadControls for ASP.NET AJAX suite features the new WYSIWYG Editor as a flexible and lightweight component, turning to be the fastest loading Web Editor. Among the hottest features are:
         <ul>
                        <li><em>Single-file, drag-and-drop deployment</em></li>
                        <li><em>Built on top of ASP.NET AJAX</em></li>
                        <li><em>Unmatched loading speed with new semantic rendering </em></li>
                        <li><em>Full keyboard accessibility</em></li>
                        <li><em>Flexible Skinning mechanism</em></li>
                        <li><em>Simplified and intuitive toolbar configuration</em></li>
                        <li><em>Out-of-the-box XHTML-enabled output</em></li>
                        </ul>
               </Content>
              </telerik:radeditor>
              
              
              <p style="clear: both; float: none;font-weight:bold;margin-top:25px;margin-bottom:10px;">3. Setting the tools programmatically in the codebehind</p>
        
        
         <telerik:radeditor runat="server" ID="RadEditor3" Height="300px">
         <Content>
                <img alt="product logo" src="../../Img/productLogoLight.gif" /> is the successor of the well known industry standard Editor for ASP.NET. The tight integration with ASP.NET AJAX and powerful new capabilities of the RadControls for ASP.NET AJAX suite features the new WYSIWYG Editor as a flexible and lightweight component, turning to be the fastest loading Web Editor. Among the hottest features are:
         <ul>
                        <li><em>Single-file, drag-and-drop deployment</em></li>
                        <li><em>Built on top of ASP.NET AJAX</em></li>
                        <li><em>Unmatched loading speed with new semantic rendering </em></li>
                        <li><em>Full keyboard accessibility</em></li>
                        <li><em>Flexible Skinning mechanism</em></li>
                        <li><em>Simplified and intuitive toolbar configuration</em></li>
                        <li><em>Out-of-the-box XHTML-enabled output</em></li>
                        </ul>
               </Content>
         </telerik:radeditor>
        
        
         <p style="clear: both; float: none;font-weight:bold;margin-top:25px;margin-bottom:10px;">4. Setting the tools by using Theme</p>
        
        
                <telerik:radeditor
                    SkinID="MinimalSetOfTools"
                    Height="300px"
                    runat="server" ID="RadEditor4">
                    <Content>
                <img alt="product logo" src="../../Img/productLogoLight.gif" /> is the successor of the well known industry standard Editor for ASP.NET. The tight integration with ASP.NET AJAX and powerful new capabilities of the RadControls for ASP.NET AJAX suite features the new WYSIWYG Editor as a flexible and lightweight component, turning to be the fastest loading Web Editor. Among the hottest features are:
         <ul>
                        <li><em>Single-file, drag-and-drop deployment</em></li>
                        <li><em>Built on top of ASP.NET AJAX</em></li>
                        <li><em>Unmatched loading speed with new semantic rendering </em></li>
                        <li><em>Full keyboard accessibility</em></li>
                        <li><em>Flexible Skinning mechanism</em></li>
                        <li><em>Simplified and intuitive toolbar configuration</em></li>
                        <li><em>Out-of-the-box XHTML-enabled output</em></li>
                        </ul>
               </Content>
                </telerik:radeditor>
        
         <qsf:footer runat="server" id="Footer1"/>
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerikโ€™s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451