Define the template

Each ArcGIS Web AppBuilder widget has an HTML template. This template defines the widget’s UI.

Open the Widget.html file in a text editor. Replace the content with the following:

<div>
    <div>I am a demo widget.</div>
</div>

To test your widget, open the config-demo.json file in the stemapp/sample-configs folder for a 2D widget or the stemapp3d/sample-configs folder for a 3D widget. Find widgetPool->widgets, and add a new widget element as follows:

{
  "label": "demo",
  "uri": "widgets/Demo/Widget"
}

Start the app through http://[your host]/webappviewer/?config=sample-configs/config-demo.json, and click the widget. The widget will look like the following:

Note:

By default, the widget’s template does not support dijits in the template. If you need to use dijits in the template, add dijit/_WidgetsInTemplateMixin to your required list, and add this class to your widget. Ensure that you have all the required dijits for your template. For more information, see the Dojo tutorial Creating template-based widgets.