Service Operations Workspace - How can I adjust the side panel within the REQ form/layout?

[kristenmkar]

Good evening! 

Question for you all if you could assist- I am trying to adjust this specific area (screenshot below) within the REQ layout in the SOW- I was able to easily adjust the Incident information, but REQ is proving to be a bit more difficult - unless I am just missing something. I believe I should be looking at the Record Information - Catalog SNC page within the

 SOW - Sidebar tabs top (page collection), but I am not seeing where I can update/remove this field. I was going to attempt to update the Request State to State (task) but I cannot find where the data is pulling from within this page component. 

I know I am close to finding it within the UI builder, but if you guys have any ideas, I would appreciate it! Thank you! 

Bonus question - if anyone knows where I can update the colors within the SOW, that would be awesome too! Specifically looking at fields within the Service Catalog (Create Request from Interaction).  Wondering if the CSS element somehow exists within my custom theme colors file? I am using Inspect within my Browser, but haven't found it quite yet: 

Thanks so much! 

[Community Alums · Accepted solution]

Hi @kristenmkar ,

1. Adjusting the REQ Layout in the SOW

The REQ layout in the SOW (Statement of Work) page is likely tied to a page component or data source configured within the UI Builder. Since you were able to adjust Incident information, here's how you can address the REQ section:

Steps to Adjust the REQ Layout:

1. Open the UI Builder:

   • Navigate to Now Experience Framework > UI Builder.
   • Open the relevant experience and select the page containing the REQ layout (e.g., "Record Information - Catalog SNC").

2. Locate the REQ Page Component:

   • In the Page Layout, look for the container or component displaying the REQ information.
   • Common components used for displaying request data:
     • Data Table (for lists of requests).
     • Data Visualization (for summaries).
     • Form or Card Components (for detailed information).
   • Review the component configuration and identify the data source (e.g., sc_request or related table).

3. Update or Remove Fields:

   • If the REQ data is fetched via a Form Component, open the associated view:
     • Go to System UI > Views, search for the form linked to the REQ layout, and update/remove fields.
   • If it's using a Data Source, check if it's a Dynamic Data Binding or Custom Script:
     • Update the data binding or adjust the script to change or remove fields.
   • To adjust Request State to State (task), confirm if the mapping is pulling from the sc_request or sc_task table. Update the field mapping as needed.

[Community Alums · Accepted solution]

Hi @kristenmkar ,

1. Adjusting the REQ Layout in the SOW

The REQ layout in the SOW (Statement of Work) page is likely tied to a page component or data source configured within the UI Builder. Since you were able to adjust Incident information, here's how you can address the REQ section:

Steps to Adjust the REQ Layout:

1. Open the UI Builder:

   • Navigate to Now Experience Framework > UI Builder.
   • Open the relevant experience and select the page containing the REQ layout (e.g., "Record Information - Catalog SNC").

2. Locate the REQ Page Component:

   • In the Page Layout, look for the container or component displaying the REQ information.
   • Common components used for displaying request data:
     • Data Table (for lists of requests).
     • Data Visualization (for summaries).
     • Form or Card Components (for detailed information).
   • Review the component configuration and identify the data source (e.g., sc_request or related table).

3. Update or Remove Fields:

   • If the REQ data is fetched via a Form Component, open the associated view:
     • Go to System UI > Views, search for the form linked to the REQ layout, and update/remove fields.
   • If it's using a Data Source, check if it's a Dynamic Data Binding or Custom Script:
     • Update the data binding or adjust the script to change or remove fields.
   • To adjust Request State to State (task), confirm if the mapping is pulling from the sc_request or sc_task table. Update the field mapping as needed.

[Community Alums · Accepted solution]

hi @kristenmkar ,

2. Updating Colors in the SOW

The colors for the Service Catalog fields and other components in the SOW can be updated via the theme settings or CSS customizations.

Steps to Update Colors:

1. Check the Theme Configuration:

   • Go to Now Experience Framework > Themes.
   • Open your custom theme and inspect the Primary Colors, Secondary Colors, or any custom variable used for field backgrounds, text, or borders.
   • Save the theme after making changes and reapply it to your experience.

2. Add Custom CSS in the Theme File:

   • Navigate to System UI > CSS Styles or add a custom CSS file if your theme supports it.
   • Use browser Inspect tools to find the specific classes or IDs applied to the fields.
   • Example:
     css

     CopyEdit

     .sow-field-background { background-color: #f5f5f5 !important; color: #333333 !important; }
   • Ensure you target only the specific components or fields in the SOW layout.

3. Inspect Field Styling in the Browser:

   • Use the Inspect Element tool to identify the CSS selectors for specific fields or containers.
   • Update the corresponding classes in your theme or CSS file.

4. Adjust Field Colors via UI Builder:

   • If the fields are part of a card or container component, look for styling options in the UI Builder.
   • Update the background, text, or border colors directly in the properties panel.

[kristenmkar]

Thank you so much! This information was very helpful! 🙂