Widgets

Warning

Widget support is experimental.

Widgets are user interface components that can be used to extend various Admin Tools. Currently, the only available extension point for widgets are detail panels in the Content Studio tool.

To create a widget, you must create a new folder in your project structure, i.e. admin/widgets/[widget-name]. Then you must place a descriptor and a controller there.

Descriptor

The widget descriptor defines the display name and the interfaces it matches.

An interface is simply a unique identifier that is used to create a link between a tool and the widget. For example, for your widget to be displayed in the “Content Studio” detail panel, add the interface “contentstudio.detailpanel”

The descriptor file must match the widget name, i.e. admin/widgets/[widget-name]/[widget-name].xml:

<widget>
  <display-name>My first widget</display-name>
  <interfaces>
    <interface>contentstudio.detailpanel</interface>
  </interfaces>
</widget>

Controller

To drive the widget, we will need a controller (See HTTP Controllers). The controller typically produces the initial widget html. Depending on the widget implementation it may also handle sub-requests from the widget.

The controller file must match the widget name, i.e. admin/widgets/[widget-name]/[widget-name].js:

exports.get = function (req) {
    return {
        body: '<html><head></head><body><h1>My first widget</h1></body></html>',
        contentType: 'text/html'
    };
};