Add custom commands

Sitefinity CMS enables you to provide a custom set of commands that are displayed in the More menu of an MVC widget while in edit mode. You can customize the commands in this menu depending on the current widget and the its current state. For example, a shared content block can render different commands than an unshared one.

You can customize all aspects of adding custom command, for example, what type of window you open when you click an item, or a command, from the menu.

To provide a custom set of commands for a widget, the controller of the widget must implement the IHasEditCommands interface. Thus, you can add to or replace the collection of commands with a custom set of commands depending on your requirements. By default, the command collection is empty. If the widget does not inherit the IHasEditCommands interface, the default commands are displayed:

• Delete
• Duplicate
• Permissions

Add custom commands

PREREQUISITES: You created a new widget.
For details how to do this, see Create widgets.

In this example, you add custom command to a Message widget. To do this:

1. Create the controller. To do this, perform the following:

   1. Create a class and name it MessageWidgetController.cs.

   2. Open the MessageWidgetController and implement the IHasEditCommands interface.

   3. Add the Commands property.

   4. Implement the method that creates a new CustomComand for the Message widget.

      NOTE: You need to also add the default commands for Delete, Duplicate, and Permissions. Otherwise, you will just see the custom commands.

   5. In the Index action, call the method of the MessageWidgetController.

      Use the following code sample: ```C# using System.Collections.Generic; using System.Web.Mvc; using Telerik.Sitefinity.Frontend.Resources; using Telerik.Sitefinity.Localization; using Telerik.Sitefinity.Mvc; using Telerik.Sitefinity.Web; using Telerik.Sitefinity.Web.UI;

      namespace BooksWidget.Mvc.Controllers { [ControllerToolboxItem(Name = "Message", SectionName = "MVC samples", Title = "Message")] public class MessageWidgetController : Controller, IHasEditCommands { public IList Commands { get; set; }

           protected virtual IList<WidgetMenuItem> InitializeCommands()
           {
               var packageManager = new PackageManager();
               var customActionLink =
                   packageManager.EnhanceUrl(RouteHelper.ResolveUrl(string.Format(MessageWidgetController.DesignerTemplate, "Custom"), UrlResolveOptions.Rooted));
      
               // Add the default commands:
               var commandsList = new List<WidgetMenuItem>();
               commandsList.Add(new WidgetMenuItem() { Text = Res.Get<Labels>().Delete, CommandName = "beforedelete", CssClass = "sfDeleteItm" });
               commandsList.Add(new WidgetMenuItem() { Text = Res.Get<Labels>().Duplicate, CommandName = "duplicate", CssClass = "sfDuplicateItm" });
               commandsList.Add(new WidgetMenuItem() { Text = Res.Get<Labels>().Permissions, CommandName = "permissions", CssClass = "sfPermItm" });
      
               //Add a custom command
               commandsList.Add(new WidgetMenuItem()
               {
                   Text = "CustomCommand",
                   ActionUrl = customActionLink,
                   NeedsModal = true
               });
      
               return commandsList;
           }
      
           public ActionResult Index()
           {
               this.Commands = this.InitializeCommands();
      
               return this.View("Index");
           }
      
           private const string DesignerTemplate = "Telerik.Sitefinity.Frontend/Designer/Master/MessageWidget?view={0}";
       }

      }

2. Create the new designer view that opens when you select a command.
   Navigate to Mvc » Views » MessageWidget  and add a new file. Next, name the file DesignerView.Custom.cshtml and under Properties, mark the file as an Embedded resource.
3. To make sure the designer view is not displayed as a tab in the normal widget designer, create a JSON file.
   Navigate to Mvc » Views » MessageWidget  and add a new file named DesignerView.Custom.json, Under Properties, mark he file as an Embedded resource.
4. Place the following content inside the JSON file:
   JSON

   {
     "hidden": true
   }

5. Build the solution.

As a result, you can see the new command in the Message widget’s More menu.

For a more comprehensive example, see the ContentBlockController class in the GitHub repository.