New to Telerik UI for ASP.NET AJAX? Start a free 30-day trial
Add Custom DropDown
Bellow are the exact steps that demonstrate how to add a custom dropdown when using RadEditor for MOSS:
-
Open the respective ToolsFile situated in the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/5.x.x.0**1f131a624888eeed/Resources folder and add the custom dropdown's declaration e.g.
XML<tool name="CustomDropdown" type="dropdown"> <item name="Item 1" Value="1"/> <item name="Item 2" Value="2"/> <item name="Item 3" Value="3"/> </tool>
-
Next, open the /Program Files/Common Files/Microsoft Shared/web server extensions/wpresources/RadEditorSharePoint/5.x.x.0**1f131a624888eeed/Resources/MOSSEditorTools.js file and add the dropdown's command:
JavaScriptTelerik.Web.UI.Editor.CommandList["CustomDropdown"] = function (commandName, editor,args) { alert("Value selected: " + args.get_value()); };
-
To improve the custom dropdown's appearance, you should provide image file for it, by setting the following CSS class in corresponding Master page:
CSS.rade_toolbar.<skinName> .<commandName> { background-image: url(MyImage.gif)!important; } .rade_toolbar.Telerik .CustomDropdown { background-image: url(https://www.telerik.com/DEMOS/ASPNET/RadControls/Editor/Skins/Default/buttons/CustomDialog.gif)!important; }
-
Clear the browser's cache and test the result.