Creating widget designers

From the context menu of SitefinityWebApp, click Add » New Item...

In the left pane of the Add New Window, select Sitefinity.

In the central pane, you can choose whether you want to create a new widget with a designer or create a designer for an existing widget.

Create a new widget with designer 

1. In the left pane of the Add New Window, click Sitefinity Widget with Designer.
   The system creates a sample widget with a widget template and generates a designer for it.  Also it will register the widget in the Sitefinity project, if such is available in the solution. It creates a section in the widget toolbox, named Custom. If you create the widget in a class library in your Sitefinity solution, the system adds a reference to the Telerik.Sitefinity.dll. Also the Sitefinity project will reference your class library.
2. Build and run the Sitefinity project and open a page for editing.
   In the toolbox, under Custom section, your newly created widget appears.
   The widget contains the relative path to its widget template. If you make any changes that affect the relative path, you must reflect them in the widget too.  
3. You can drop the newly created widget and use its designer.

Create a designer for an existing widget

1. Click Designer for Existing Widget.
   A wizard appears. When you click Next, the wizard finds all the widgets in the current project.
   This can take up to 30 seconds, it also freezes Visual Studio while working.

   NOTE: You must build the project that contains your widget, in order for Sitefinity Thunder to discover it.

2. Select for which widget you want to create a designer and click Next.
3. Select which properties to include in the designer of the widget (the simple view of the designer).  
   You can choose basic types like integer, double, string, decimal, bool, DateTime and enumerations.
4. To edit a selected property, double-click it or click the Edit button.
5. After selecting the properties, you can use drag-and-drop to reorder them in the way you would like them to appear in the designer.
6. Click Next.
7. After the wizard is done, if your widget is not registered in the page editor toolbox, you can use again Sitefinity Thunder to register it.

   The wizard creates three files – the designer control implementing the ControlDesignerBase class, the template, and the designer javascript component.

Creating designers for existing MVC widgets

Sitefinity Thunder can find a MVC widget and create a designer for it. The designers created are Web Forms based.

IMPORTANT: The javascript component is using your designer control with its full name (<namespace>.<class>). You must change it, if you rename or move your designer component class.

When a designer or a widget is created in a web project, all the resources, such as javascript files and the .ascx templates, will be included with their application relative paths. 

If the operations are done in a class library, the resources files will be included as embedded resources and the javascript files will be registered in the assembly. For the .ascx templates, the system creates a registration in the virtual path settings that is required to work with embedded .ascx templates.

Your designer control contains the relative paths to the designer template and the javascript component. If you move or rename them, you must reflect the changes in the designer control.

NOTE: If you have selected a Form widget, the system automatically adds a Developer Name (implements IFormFieldControl).