Create a widget that displays a ServiceNow UI page

You can create ServiceNow UI page that displays a web page, then make the UI page into a widget that can be added to dashboards and homepages.

1. Create or find a ServiceNow UI page that you want to display as a widget. Note the name of this UI page, to use in Step 4.

   For example, this HTML shows the ServiceNow landing page in an iframe.

   <iframe id="myframe" src="http://www.service-now.com" scrolling="yes" style="height:100%; width:100%"></iframe>

2. Navigate to System UI > Widgets and click New.
   Widgets records are widget category records, not records for individual widgets. When adding a widget to the dashboard, first select the category and then the widget. The javascript you specify in step 4 contains the list of widgets to include in that category.
3. Fill in the following fields.

   Field	Description
   Name	The name of this widget category. The user selects this category when adding its widgets to a dashboard.
   Renderer Type	Select Javascript.
   Active	Clear to make the widget unavailable to add to dashboards.
   Roles	Select roles that can see this category when adding widgets to dashboards. If no roles are selected, all roles can see the category.

4. Add the following javascript in the Script field, making replacements as specified. The return statement contains the widgets that are listed in this widget category.

   widget_name	The name of the widget, which the user selects in the widget picker when adding the widget to a dashboard. This string also appears on the widget header.
   UI_page_name	The name of the UI page from Step 1 to show in the widget.

   function sections() {
       return {
           'widget_name': { 'uiPageName' : 'UI_page_name'},
           'widget_name2': {'uiPageName': 'UI_page_name'}
       };
   }
   
   function render() {
       var uiPageName = renderer.getPreferences().get("uiPageName");
       return renderer.getRenderedPage(uiPageName);
   }
   
   function getEditLink() {
       return "sys_ui_page.do?sysparm_query=name=" + renderer.getPreferences().get("uiPageName");
   }

5. Click Submit.
   To learn how to make a UI page without using a framework page template, see the Making a UI page without using the framework page template blog posting by a developer in the ServiceNow Community.