Articles → ASP .NET AJAX → Adding Spaces Between Buttons In Ajax HTML Editor In C#

Adding Spaces Between Buttons In Ajax HTML Editor In C#

Objective Of This Tutorial


  1. Download AjaxControlToolKit.dll (version 3.5 and above).
  2. Copy the downloaded DLL in the bin folder of the project.
  3. Copy AjaxMin.dll to bin folder as well
  4. Visual studio 2008(or above)

  1. How to create a web based project in visual studio?
  2. What is a class?
  3. How to inherit a class?
  4. How to override a method?
  5. What are AJAX controls?
  6. How to register a control in the aspx page?
  7. How to add a web form in the web based application in the visual studio?
  8. Understanding of the Cascading Style Sheets.
  9. How to customize the Ajax HTML editor?

Customization Of The Editor


using AjaxControlToolkit.HTMLEditor;
using AjaxControlToolkit.HTMLEditor.ToolbarButton;

namespace MyControls {
	/// <summary>
	/// Summary description for CustomEditor
	/// </summary>
	public class CustomEditor: Editor {
		protected override void FillTopToolbar() {
			TopToolbar.Buttons.Add(new Bold());
			TopToolbar.Buttons.Add(new Italic());
			TopToolbar.Buttons.Add(new Underline());
    //  FillBottomToolbar method to render bottom toolbar in editor
		protected override void FillBottomToolbar() {
			BottomToolbar.Buttons.Add(new DesignMode());
			BottomToolbar.Buttons.Add(new HtmlMode());

<style type="text/css">
   margin-right: 5px !important;

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Customize.aspx.cs" Inherits="Customize" %><%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajax" %><%@ Register Namespace="MyControls" TagPrefix="HTMLEditor" %>
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
		<head runat="server">
			<style type="text/css">
         margin-right: 5px !important;
			<form id="form1" runat="server">
				<ajax:ToolkitScriptManager ID="ScriptManager1" runat="server"></ajax:ToolkitScriptManager>
				<HTMLEditor:CustomEditor ID="editor" runat="server" />


Picture showing the image buttons with spaces in custom HTML editor
Click to Enlarge

Posted By  -  Karan Gupta
Posted On  -  Monday, February 3, 2014


Your Email Id  
Query/FeedbackCharacters remaining 250