This page allows you to view a standard widget, or edit a custom widget.
If the standard widget does not meet your needs, you can create a custom widget to match exactly what you want to. To do this, clone the standard widget by saving it with a different name, and modify it. After creation, the custom widget is available in the palette for designing pages, forms, layouts or fragments.
Widget implementation is based on the AngularJS framework.
For more information, see the AngularJS guide on templates and controllers.
For the moment, you cannot implement custom widget containers.
Custom widgets are not clearly visible on the whiteboard but you can see them with the preview.
The widget HTML template is defined here.
You can use standard HTML tags and AngularJS built-in directives, scope and interpolation system.
Widget properties defined on the right can be used as variables in a template with properties.newProperty.
Functions exposed in the controller can be used with ctrl.newFunction().
You can use the environment property injected in the scope when inside the whiteboard editor. It allows to create a mockup display for the whiteboard as the real use data will not be available.
The controller is a JavaScript function that augments the AngularJS scope and exposes functions that can be used in the widget template.
Widget properties defined on the right can be used as variables in a controller with $scope.properties.
To use AngularJS standard services, you must declare them in the main function arguments.
Controller can be left empty if not needed.