New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Add Custom DropDown

Telerik Web Parts for SharePoint 2010 last build was R1 2023 SP2 and is discontinued since then.

Bellow are the exact steps that demonstrate how to add a custom dropdown when using RadEditor for SP2010:

  1. Open the respective ToolsFile situated in the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/6.x.x.0__1f131a624888eeed/Resources folder and add the custom dropdown's declaration e.g. <tool name="CustomDropdown" type="dropdown"> <item name="Item 1" Value="1"/> <item name="Item 2" Value="2"/> <item name="Item 3" Value="3"/></tool>

  2. Next, open the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/6.x.x.0__1f131a624888eeed/Resources/SPEditorTools.js file and add the dropdown's command:


    Telerik.Web.UI.Editor.CommandList["CustomDropdown"] = function (commandName, editor, args)
        alert("Value selected: " + args.get_value());
  3. To improve the custom dropdown's appearance, you should provide image file for it, by setting the following CSS class in corresponding Master page:


    <style type="text/css">
        .rade_toolbar.<skinName> .<commandName>
         background-image: url(MyImage.gif)!important;
        .rade_toolbar.Telerik .CustomDropdown
         background-image: url(!important;
  4. Clear the browser's cache and test the result.

In this article