Sitefinity ASP.NET CMS can be customized very easily using traditional ASP.NET technologies.  This makes it possible for .NET developers to create new functionality by adding tools.  These tools can then be used by editors (non-developers) to manage the web site. 

By default, Sitefinity will automatically generate a web-based interface for custom controls/tools.  For very simple controls, this interface is probably sufficient.  For complex controls, this interface can quickly become overwhelming. 

The interface above fails to empower editors to manage the web site; it isn't user-friendly and will intimidate non-developers.  To remedy this, developers can use Control Designers to replace the default web-interface with a very user-friendly interface. 

Creating a Custom Tool using an ASP.NET UserControl

Developers will primarily extend Sitefinity through ASP.NET Controls.  Below is a basic UserControl that displays Text with varying emphasis based on the Priority level.  (See code notes below.) 

~/App_Code/CustomControlBase.cs

[Telerik.Framework.Web.Design.ControlDesigner("CustomDesigner")]
public class CustomControlBase ...

Sitefinity CMS can be extended very easily using traditional ASP.NET UserControls.  Once a UserControl is added to Sitefinity, Sitefinity will automatically generate a web admin interface.

In addition to the auto-generated interface, Sitefinity Control Designers can be used to create very user-friendly custom web-based interfaces:

Control Designers can be attached to an existing UserControl by adding a Telerik.Framework.Web.Design.ControlDesigner attribute:

using System;

[Telerik.Framework.Web.Design.ControlDesigner("CustomDesigner")]
public partial class Custom_UserControls_CustomControl : System.Web.UI.UserControl
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
}

Custom Control Designers can be created by creating a new class and inheriting from the Telerik.Framework.Web.Design.ControlDesigner base class:

~/App_Code/CustomDesigner.cs

public class CustomDesigner : Telerik.Framework.Web.Design.ControlDesigner
{
        public CustomDesigner() 
        {
        }
}

The Control Designer becomes responsible for rendering a web-interface and setting the underlying control properties.

Getting Access to the Underlying Control Properties

Control Designers have access to the underlying control via the DesignedControl property.  However, this isn't as simple as it might seem.  Consider the following ...

Sitefinity CMS can be extended very easily using traditional ASP.NET UserControls.  Once a UserControl is added to Sitefinity, Sitefinity will automatically generate a web admin interface. 

To make this web interface less intimidating we can use design time attributes to hide properties, apply categories or set default properties:

WebEditors can be added to assist with setting complex properties:

Control Designers are the final step in this process and make control editing VERY user friendly

In this post we'll examine how to add a Control Designer to an existing User Control.

What is a Control Designer?

Control Designers add a new Basic tab to the Sitefinity Control Editor.  The default auto-generated property editor gets put into the Advanced tab.  Within the Basic tab, Control Designers create an entirely custom interface for configuring underlying control properties. 

Control Designers empower us to create user-friendly forms, multi-step wizards, search interfaces, etc. ...