Skip to content
Richscripts

Add your own custom button

CuteEditor for .NET

Add Your Own Custom Buttons

You can easily add your own custom buttons to the CuteEditor toolbar using the following methods:

1. Add your own custom buttons into the custom button holder:

C# Example:

  1. CuteEditor.ToolControl tc = Editor1.ToolControls["insertcustombutonhere"];   
  2. if(tc!=null)   
  3. {       
  4.    System.Web.UI.WebControls.Image Image1 = new System.Web.UI.WebControls.Image ();   
  5.    Image1.ToolTip    = "Insert today's date";   
  6.    Image1.ImageUrl    = "tools.gif";   
  7.    Image1.CssClass    = "CuteEditorButton";   
  8.    SetMouseEvents(Image1);   
  9.    Image1.Attributes["onclick"]="var d = new Date(); CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,d.toLocaleDateString())";   
  10.    tc.Control.Controls.Add(Image1);   
  11. }  

VB Example:


  1. Dim tc as CuteEditor.ToolControl     
  2. tc = Editor1.ToolControls("insertcustombutonhere")   
  3.      
  4. If Not tc Is Nothing Then  
  5.      Dim Image1 As New System.Web.UI.WebControls.Image()   
  6.      Image1.ToolTip    = "Insert today's date"  
  7.      Image1.ImageUrl    = "tools.gif"  
  8.      Image1.CssClass    = "CuteEditorButton"  
  9.      SetMouseEvents(Image1)   
  10.      Image1.Attributes("onclick")="var d = new Date(); CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,d.toLocaleDateString())"  
  11.      tc.Control.Controls.Add(Image1)   
  12. End If  
2. Add your own custom buttons using the Editor.InsertToolControl method:

C# Example:


  1. // Create the custom button using the Editor.CreateCommandButton method   
  2. // Themes/%ThemeName%/Images/text.gif   
  3. WebControl ctrl=Editor1.CreateCommandButton("MyButton","text.gif","Insert My Custom Text");   
  4. ctrl.Attributes["onclick"]="CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,'<h2>Hello World</h2>')";   
  5.   
  6. //get the pos after the Italic   
  7. int pos=Editor1.ToolControls.IndexOf("Italic")+1;   
  8.     
  9. //add this custom button into the editor   
  10. Editor1.InsertToolControl(pos,"MyButton",ctrl);  


VB Example:


  1. 'Create the custom button using the Editor.CreateCommandButton method   
  2. Dim ctrl As System.Web.UI.WebControls.WebControl   
  3. ctrl = Editor1.CreateCommandButton("MyButton", "text.gif", "Insert My Custom Text")   
  4. ctrl.Attributes("onclick")="CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,'<h2>Hello World</h2>')";      
  5.      
  6. 'get the pos after the Italic   
  7. Dim pos As Integer  
  8. pos = Editor1.ToolControls.IndexOf("Italic") + 1   
  9.      
  10. 'add this custom button into the editor   
  11. Editor1.InsertToolControl(pos, "MyButton", ctrl)  
3. Registers a custom button so that it can be used in the template list:

C# Example:


  1. // Create the custom button using the Editor.CreateCommandButton method   
  2.   
  3. //Themes/%ThemeName%/Images/text.gif   
  4. WebControl ctrl=Editor1.CreateCommandButton("MyButton","text.gif","Insert My Custom Text");   
  5. ctrl.Attributes["onclick"]="CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,'<h2>Hello World</h2>')";   
  6.     
  7. //register the custom button   
  8. Editor1.RegisterCustomButton("mybutton",ctrl);  

VB Example:


  1. 'Create the custom button using the Editor.CreateCommandButton method   
  2.  Dim ctrl As System.Web.UI.WebControls.WebControl   
  3.  ctrl = Editor1.CreateCommandButton("MyButton", "text.gif", "Insert My Custom Text")   
  4.  ctrl.Attributes("onclick")="CuteEditor_GetEditor(this).ExecCommand('PasteHTML',false,'<h2>Hello World</h2>')"     
  5.      
  6.  'register the custom button    
  7.  Editor1.RegisterCustomButton("mybutton",ctrl)  

Now you can use the custom buttons in the template list:


<CE:Editor id="Editor1" TemplateItemList="[Bold,Italic]/[mybutton]"></CE:Editor>




© 2003 - 2012 richscripts.com. All rights reserved.