Join the #BuildWithBuildAgent Challenge! Get recognized, earn exclusive swag, and inspire the ServiceNow Community with what you can build using Build Agent.  Join the Challenge.

How to Remove Form header content from Compliance workspace

asaha
Tera Contributor

Hi Team,

I need assistance with removing the form header content in the Compliance Workspace. Specifically, I’d like to remove the highlighted in "BLUE" section — “Record Type: Policy” — from the workspace header (please refer to the attached screenshot for clarity).

Could someone please guide me on how to remove this section? Your support would be greatly appreciated.

4 ACCEPTED SOLUTIONS

ChallaR
Giga Guru

Hi @asaha ,

 

please find the below steps -

Steps to Remove “Record Type” from Workspace Header

  1. Open UI Builder

    • Navigate to Workspace > Compliance Workspace in your instance.
    • Click Edit in UI Builder.
  2. Locate the Form Header Component

    • In the UI Builder canvas, select the page that displays the record (usually the Record page).
    • Find the Form Header component in the component tree.
  3. Modify Header Template

    • The header is usually configured using Data Resources and Slots.
    • Look for the slot or template that includes Record Type or the field that displays the blue pill.
    • Remove or disable that field from the header configuration.
  4. Alternative: Hide via CSS

    • If you cannot remove it via UI Builder, you can hide it using a CSS override
.now-record-type-pill {
  display: none !important;
}
    • Add this CSS in the Theme or Page Styles for the workspace.

NOTE - Reason of issue 

The “Record Type” pill is automatically shown when the workspace uses Record Type metadata for navigation or filtering. Removing it won’t affect functionality unless other components depend on it.

 

Thanks,

Rithika.ch

View solution in original post

HI @asaha ,

please find the below option to resolve this-

Option 1: Remove via UI Builder

  1. Go to UI Builder → Open the Compliance Workspace → Select the Record page.
  2. In the component tree, look for:
    • Record Info or Header component (usually inside the page template).
  3. Expand the slots and check for Record Type pill configuration.
    • If present, disable or delete that slot.
  4. If it’s part of the template and not editable, you can replace the template with a custom header.

Option 2: Hide via CSS

If UI Builder doesn’t expose it, use CSS:

 
.now-record-type-pill {
    display: none !important;
}

 

Apply this CSS in:

  • Theme for Compliance Workspace, or
  • Add a Style block in UI Builder for that page.

TEST -

Inspect the element in your browser (Right-click → Inspect). You’ll see a class like:

.now-record-type-pill

or similar. That’s the selector you need for CSS.

 

Thanks,

Rithika.ch

 

View solution in original post

Hi @asaha ,

 

I checked in my PDI I think it is coming from the table level.

 

SarthakKashyap_0-1762270460627.png

SarthakKashyap_1-1762270476138.png

 

Please mark my answer correct and helpful if this works for you

Thanks and Regards,

Sarthak

 

View solution in original post

Hi @asaha ,

 

I also tried to remove that header 1st entry open UI Builder open that exact page then click on the component and in CSS add display:none;

 

SarthakKashyap_0-1762271554317.png

 

Please mark my answer correct and helpful if this works for you

Thanks and Regards,

Sarthak

 

View solution in original post

10 REPLIES 10

HI @asaha ,

please find the below option to resolve this-

Option 1: Remove via UI Builder

  1. Go to UI Builder → Open the Compliance Workspace → Select the Record page.
  2. In the component tree, look for:
    • Record Info or Header component (usually inside the page template).
  3. Expand the slots and check for Record Type pill configuration.
    • If present, disable or delete that slot.
  4. If it’s part of the template and not editable, you can replace the template with a custom header.

Option 2: Hide via CSS

If UI Builder doesn’t expose it, use CSS:

 
.now-record-type-pill {
    display: none !important;
}

 

Apply this CSS in:

  • Theme for Compliance Workspace, or
  • Add a Style block in UI Builder for that page.

TEST -

Inspect the element in your browser (Right-click → Inspect). You’ll see a class like:

.now-record-type-pill

or similar. That’s the selector you need for CSS.

 

Thanks,

Rithika.ch

 

Hi @asaha ,

 

I checked in my PDI I think it is coming from the table level.

 

SarthakKashyap_0-1762270460627.png

SarthakKashyap_1-1762270476138.png

 

Please mark my answer correct and helpful if this works for you

Thanks and Regards,

Sarthak

 

Hi @asaha ,

 

I also tried to remove that header 1st entry open UI Builder open that exact page then click on the component and in CSS add display:none;

 

SarthakKashyap_0-1762271554317.png

 

Please mark my answer correct and helpful if this works for you

Thanks and Regards,

Sarthak

 

Thanks Brother for your help. It worked.

@Sarthak Kashyap  @ChallaR 
Dear Brothers,
Section 1 items:

asaha_3-1762489077853.png

 


Thank you for your help but I am stuck in a place for the same issue.
I wanted to remove "Record Type" only but since the css removes the entire section 1 so I removed it and later on deleted that section 1 (and made this page variant available for only my selected table(sn_compliance_policy). 

asaha_0-1762488494581.png

 



But I needed the other values like 'Number' and 'State' in the header (which were available in section 1), I thought I can add that in the section 2 via 'Secondary values' (sys_aw_form_header) the way you showed before but all the fields are getting added and getting displayed there  except 'Number' and 'State'. What could be the reason ? Can you please help ?

asaha_1-1762488768755.pngasaha_2-1762488838515.png