Change Theme Settings
Change Theme Settings
Show All Themes

Custom Toolbar Items

  • Undo (Ctrl+Z)
  • Redo (Ctrl+Y)
  • Bold (Ctrl+B)
  • Italic (Ctrl+I)
  • Underline
  • Strikethrough
  • v
  • Smile
  • v

This demo illustrates how you can extend the MVC HTML Editor’s toolbar with custom items and implement item-specific functionality.

In addition to standard items available within built-in toolbars, the HTML Editor allows you to add custom items and provide specific functionality for them. The following custom item types are shipped with the MVC HTML Editor:

  • Combo Box (ToolbarComboBox item). A combo box provides a standard dropdown list of individual items. In this demo, you can apply a specific font size to the currently selected content by picking an appropriate combo box item.
  • Dropdown Item Picker (ToolbarDropDownItemPicker item). A dropdown item picker represents a button with a dropdown and contains a list of selectable items. To select an item, users can hover the mouse pointer over a button or click it to activate its dropdown list and then select an item within the list. In this demo, you can insert smilies within the editor via a dropdown item picker.
  • Dropdown Menu (ToolbarDropDownMenu item). A dropdown menu item represents a button that displays a dropdown menu when clicked. In this demo, you can insert the current date and time into the editor by selecting the desired date/time format within the dropdown menu.

To ensure ease of use, these item types provide a common API. Open the demo's Code page to see how you can populate dropdown lists with items and respond to item clicks.