Widget designers

With Sitefinity CMS, you can work with the widget designer framework, based on client technologies like HTML, JavaScript, AngularJS, and Bootstrap. You can also benefit from a library of reusable client components.

А widget designer is an AngularJs module, in which each view has an AngularJs controller. By default, Sitefinity CMS exposes all public properties available in the widget controller, so they can be edited through the widget’s designer. All of these properties are available in $scope.properties of the AngularJs controller. When you edit any of these properties and save the designer, your changes are persisted in the database. Using $scope.properties enables you to bind properties of the widget directly in your designer view template without writing any additional code. The property service object enables you to get all widget controller properties and use them in the widget designer controller.

Controllers are separate components, so can be easily reused between views. 
For more information, see AngularJs and  AngularJs Scopes.

Widget designers load a predefined AngularJs controller that handles populating and saving of widget properties through the designer. If you want to modify this default AngularJs controller, you can extend the designer with additional client logic. For more information, see Extend default widget designers.

When working with or extending default widget designers and your designer views use only client components:

  • The JSON file with scripts registration is automatically generated.
  • The JavaScript file with all Angular dependencies is automatically generated.
  • If no other designer views with explicitly set priority exists, the priority of the designer view is set to 1.

NOTE: If you have JSON or JavaScript files that match the naming conventions, even if these files are empty, automatic scripts registration or dependencies registration do not occur.
For more information, see Client components.

Additional resources


External links


Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.


Was this article helpful?