Understand widgets

Widgets are made up of a set of source files and resources.

A number of things provide the widget with its functionality and include the following:

• Templates: Display templates for showing content using knockout.js data bindings.
• JavaScript: View model per widget (optional).
• CSS: Styles for the widget. Can be pure CSS or Less (see http://www.lesscss.org).
• Locale resources: Translation resources per locale for the widget.
• Images: Images used for the widget, referenced via the widget asset mappings.

Widgets also consist of auxiliary files that contain help, configuration, and meta-data describing the widget. They include the following:

• Meta-data: The meta-data that describes the widget.
• Elements: Small pieces or fragments of functionality for a widget, including a display template snippet and a view model.
• Configurable widget settings: A mechanism for providing configurable widget settings that the page layout designer can use to customize the widget’s behavior on the Design page, for example, limiting the number of products to display on a Related Products widget.
• Configuration: Default configuration can be delivered with the widget.