Add and configure the Portal Data List widget

Add a Portal Data List widget to your portal and modify its data, appearance, and behavior. You can use the Portal Data List widget to display different case-related data in a card or list format on your portal.

Before you begin

The UI Components for Customer Portals plugin must have been activated. For more information, see Activate the UI Components for Customer Portals plugin.

If you have not already created the page to which you want to add the widget, see Create a page for Configurable Portal widgets.

Role required: sp_admin

Procedure

Navigate to the All > Service Portal > Service Portal Configuration.
Select Designer.
On the Service Portal Designer page, search for and select the page to which you want to add the widget.
Select the Widgets tab.
In the Layouts section, drag the Container layout onto the portal edit page.
On the container, add a set of columns by selecting the plus button ([Omitted image "portal-plus-icon.png"] Alt text: Plus button).
On the Widgets pane, in the Filter Widget field, enter Portal Data List.
Drag the widget onto the container.
In the Edit page, select the Portal Data List widget.
Select the Pencil icon ([Omitted image "icon-pencil-ac.png"] Alt text: Pencil icon).

On the instance options page, in the Data field, paste and update the following JSON code to configure the lists.

JavaScript

[
  {
    "category": "All Cases",
    "ID": "all_cases",
    "table": "sn_customerservice_case",
    "view": "csp",
    "card_view_primary_column": "number",
    "card_view_secondary_column": "short_description",
    "card_view_additional_columns": "product|contact|account|priority",
    "target_page_id": "standard_ticket",
    "guest_view": "connect",
    "scope_runtime_filters_to_sub_category": true,
    "role_based_views":{
    "field_service_agent_view":"snc_field_technician",
    "agent_case_view":["snc_customer_service_agent","snc_manager"]
     },
     "sub_categories": [
      {
        "sub_category": "Open",
        "sub_category_query": "active=true"
      },
      {
        "sub_category": "Closed",
        "sub_category_query": "active=false"
      }
    ],
    "run_time_filters": [
      {
        "column": "product",
        "selection_type": "multi_select",
        "show_all_reference_filter_values": true
      },
      {
        "column": "contact",
        "selection_type": "multi_select",
        "show_all_reference_filter_values": true
      },
      {
        "column": "account",
        "selection_type": "multi_select"
      },
      {
        "column": "priority",
        "selection_type": "multi_select"
      },
      {
        "column": "state",
        "selection_type": "multi_select"
      },
      {
        "column": "sys_updated_on",
        "selection_type": "single_select",
        "ranges": [
          {
            "label": "Last 30 days",
            "query": "sys_updated_on<=javascript:gs.endOfToday()^sys_updated_onRELATIVEGT@dayofweek@ago@30"
          },
          {
            "label": "Last 60 days",
            "query": "sys_updated_on<=javascript:gs.endOfToday()^sys_updated_onRELATIVEGT@dayofweek@ago@60"
          },
          {
            "label": "Last 90 days",
            "query": "sys_updated_on<=javascript:gs.endOfToday()^sys_updated_onRELATIVEGT@dayofweek@ago@90"
          },
          {
            "label": "Before 90 days",
            "query": "sys_updated_onRELATIVELT@dayofweek@ago@90"
          }
        ]
      }
    ]
  },
  {
    "category": "Actions Needed",
    "table": "sn_customerservice_case",
    "view": "Case",
    "card_view_primary_column": "number",
    "card_view_secondary_column": "short_description",
    "card_view_additional_columns": "product|priority|state|contact",
    "filter": "stateIN6,18",
    "glyph": "check",
    "target_page_id": "csm_ticket"
  },
  {
    "category": "Work Orders",
    "table": "wm_order",
    "card_view_primary_column": "number",
    "card_view_secondary_column": "short_description",
    "card_view_additional_columns": "priority|state",
    "glyph": "briefcase"
  }
]

For more information, see Portal Data List widget JSON parameters.

Each category in the widget displays a list of filtered records from a selected table. The default table is the Case [sn_customerservice_case] table. In a category, you can further filter the records and display them in tabs using the pre_defined_filters parameter. You can also configure the filter options displayed in the filter icon using the run_time_filters parameter.

On the Instance form, fill in the fields.

For a description of the field values, see Portal Data List widget instance options form.
Select Save.

title	Add and configure the Portal Data List widget
description	Add a Portal Data List widget to your portal and modify its data, appearance, and behavior. You can use the Portal Data List widget to display different case-related data in a card or list format on your portal.
locale	en-US
canonical_url	https://www.servicenow.com/docs/r/australia/customer-service-management/customer-self-service-and-omnichannel-engagement/config-data-list-widget-inst-optns.html
release	australia
product	Customer Self-service and Omnichannel Engagement
classification	customer-self-service-and-omnichannel-engagement
topic_type	task
last_updated	2026-09-10
reading_time_minutes	2
breadcrumb	Portal Data List widgetSet up Configurable Portal widgetsSet up self-serviceConfigureCustomer Service Management