sarah_bioni
ServiceNow Employee
ServiceNow Employee

Creating a custom tab, such as "Overview," in a Workspace within ServiceNow can be efficiently done using the UI Builder. Below is a detailed step-by-step guide to help you accomplish this.

 

Step 1: Access the UI Builder

  1. In the ServiceNow navigation menu, go to:
    Now Experience Framework > UI Builder.

  2. In the UI Builder, locate the specific Workspace where you want to add the "Overview" tab. For this example, we’ll use the Risk Workspace.


Step 2: Identify the Page and Variant

  1. Inside the Workspace, open the page named Record Default, which is the default configuration for record views.

  2. In the page layout, locate the component named Record page tabs.

  3. Click the three dots (options menu) next to this component and select Edit Record page tabs.

Screenshot 2025-01-02 at 19.05.47.png

A new tab will open, displaying all the available pages and variants.


Step 3: Duplicate an Existing Variant

  1. Identify an existing page variant that closely matches your requirements.
    For example, select the appropriate variant if you’re working on the Risk Workspace and want to add an "Overview" tab for the sn_risk_risk record.

    Screenshot 2025-01-02 at 19.08.50.png

  2. Click the hamburger icon (☰) in the upper-left corner of the variant and choose Duplicate variant.

Screenshot 2025-01-02 at 19.09.02.png

 

 


Step 4: Adjust the Variant Settings

  1. After duplicating, modify the Variant conditions in the Settings tab to ensure the variant applies to your specific table.
    Example: parent.table=your_table_name^parent.sysId!=-1

  2. Update the Data configuration:

    • Change the Lookup record data source to point to your specific table.
      Example: In the Risk info data resource, update the table field to match your desired table, e.g., Risk Matrix.
  3. Adjust the Client Scripts and components in the layout to ensure they are correctly linked to your table and fields.


Step 5: Add the "Overview" Tab

  1. In the duplicated variant, customize the layout and components to display the information you want in the "Overview" tab.

  2. Ensure that all components (like data resources, lists, or widgets) are correctly configured to pull data from your specific table.


Step 6: Publish Your Changes

  1. Once all adjustments are complete, save your changes in the UI Builder.

  2. Test the Workspace to confirm that the "Overview" tab appears and functions as expected.

Screenshot 2025-01-02 at 19.23.08.png


This process ensures you can efficiently create and customize a new "Overview" tab in any Workspace, enhancing user experience and functionality.

Comments
EduPereira
ServiceNow Employee
ServiceNow Employee

@sarah_bioni , Fantastic job on this KB! The step-by-step instructions are clear and easy to follow, making it accessible for both new and experienced users. The use of screenshots is a great addition, providing valuable visual guidance. I also appreciate how you explained the purpose of the "Overview" tab, ensuring users understand its value beyond just the technical setup. Your adherence to ServiceNow best practices and terminology is spot on.

This is a well-structured and highly useful article—great work! Looking forward to more of your contributions.

Warmest Regards,
Eduardo Pereira

Version history
Last update:
‎01-02-2025 02:23 PM
Updated by:
Contributors