Link widget components

This article gives an overview of how widget components interact and how you connect them to create a complete widget.

 SAMPLE: For a sample code of a widget class, see HelloWorld.cs in Sitefinity documentation-samples on GitHub.:

• Link to the designer
  You must associate the widget class with the control designer. This is done by the ControlDesignerAttribute class.

  In the HelloWord sample, the widget class is HelloWorld.cs and the control designer class is HelloWorldDesigner.cs. To link them together, you must add the attribute to the widget class.

• Link the widget template
  In the HelloWorld sample, the widget class is HelloWorld.cs and the widget template is HelloWorld.ascx. The widget class needs to know which template file to load. You do this by overriding the LayoutTemplatePath property and passing a constant with the relative path to the widget template.

 SAMPLE: For a sample code of a widget designer, see HelloWorldDesigner.cs in Sitefinity documentation-samples on GitHub:

• Link to the designer template
  In the HelloWorld sample, the designer class is HelloWorldDesigner.cs and the designer's template is HelloWorldDesigner.ascx. The designer class needs to know which template file to load. You do this by overriding the LayoutTemplatePath property. Because the template of the custom widget is always an Embedded Resource, you must enter a full path to the designer's template.
• Register the control designer script
  In the HelloWorld sample, the control designer class is HelloWorldDesigner.js. You must register it in the designer by overriding the GetScriptReferences() method and passing the path to the JavaScript file. Provide a full path name to the JavaScript file including the assembly name.

When you are finished with the development of you widget, you must register it.
For more information, see Register a new widget in Sitefinity CMS toolbox.