Catalog item container - UI Builder

Alex-Lima84
Tera Contributor

Hello everyone.

 

Thanks in advance.

 

I'm trying to remove the "Add any details to your request" container that is showing at the end of my catalog item container in the UI Builder. I've looked everywhere and could not find an answer. I think it is related to a Macro, but I'm not sure. I tried to search within the platform, but was not able to find it.

 

Can anyone help me? This is a technical test and I need to submit still this week.

 

 

 

1 ACCEPTED SOLUTION

HunterSWolf
Giga Guru

I found this article which does not give you a solution really because the link in it is archived. but after nearly tossing my computer across the room I found the worst possible way to do this but works for us.

If you edit the "Virtual Agent Popup Content" UI builder page (my link format is this  not sure it will work on other instances) 
https://YOURINSTANCENAME.service-now.com/now/builder/ui/edit/experience/58c25fcc5bee011038a16ada1d81c72a/81c4d7405b22411038a16ada1d81c7dc/c5c4d7405b22411038a16ada1d81c7d8

On this page will create a new client script and run it on the page ready event.

Scripts are here:

HunterSWolf_0-1706650380684.png

Create a new script by clicking the add plus and give it a name

HunterSWolf_1-1706650415807.png

Then for the script I used the following. If you have made edits to this page.... good luck this was a huge pain to figure out.

function handler({api, event, helpers, imports}) {
   //console.log('test');
 helpers.timing.setTimeout(function () {            
    var style = this.document.createElement('style');
	style.innerHTML = '.sc-additional-details {display: none}';
   this.window.document.querySelector('macroponent-aededa80c782201072b211d4d8c2604c').shadowRoot.querySelector('sn-canvas-appshell-main').shadowRoot.querySelector('macroponent-76a83a645b122010b913030a1d81c780').shadowRoot.querySelector('sn-canvas-main').shadowRoot.querySelector('sn-canvas-screen').shadowRoot.querySelector('macroponent-09c4d7405b22411038a16ada1d81c7d6').shadowRoot.querySelector('macroponent-afeef20635001010f877265d86f080df').shadowRoot.querySelector('now-collapse').querySelector('sn-catalog-additional-details').shadowRoot.appendChild(style);
 });
}

 

After you add this click on body and then in the "Page configurations click events

HunterSWolf_2-1706650604658.png

Click Add Event Mapping and select "Page ready"

HunterSWolf_3-1706650652634.png

Then select your new script (should be at the bottom.) and test it out. 

HunterSWolf_4-1706650747438.png

This will remove the entire section for add any details to your request you may be able to just do one of them but you would have to go deeper in the DOM to find those elements.

 

View solution in original post

2 REPLIES 2

HunterSWolf
Giga Guru

I found this article which does not give you a solution really because the link in it is archived. but after nearly tossing my computer across the room I found the worst possible way to do this but works for us.

If you edit the "Virtual Agent Popup Content" UI builder page (my link format is this  not sure it will work on other instances) 
https://YOURINSTANCENAME.service-now.com/now/builder/ui/edit/experience/58c25fcc5bee011038a16ada1d81c72a/81c4d7405b22411038a16ada1d81c7dc/c5c4d7405b22411038a16ada1d81c7d8

On this page will create a new client script and run it on the page ready event.

Scripts are here:

HunterSWolf_0-1706650380684.png

Create a new script by clicking the add plus and give it a name

HunterSWolf_1-1706650415807.png

Then for the script I used the following. If you have made edits to this page.... good luck this was a huge pain to figure out.

function handler({api, event, helpers, imports}) {
   //console.log('test');
 helpers.timing.setTimeout(function () {            
    var style = this.document.createElement('style');
	style.innerHTML = '.sc-additional-details {display: none}';
   this.window.document.querySelector('macroponent-aededa80c782201072b211d4d8c2604c').shadowRoot.querySelector('sn-canvas-appshell-main').shadowRoot.querySelector('macroponent-76a83a645b122010b913030a1d81c780').shadowRoot.querySelector('sn-canvas-main').shadowRoot.querySelector('sn-canvas-screen').shadowRoot.querySelector('macroponent-09c4d7405b22411038a16ada1d81c7d6').shadowRoot.querySelector('macroponent-afeef20635001010f877265d86f080df').shadowRoot.querySelector('now-collapse').querySelector('sn-catalog-additional-details').shadowRoot.appendChild(style);
 });
}

 

After you add this click on body and then in the "Page configurations click events

HunterSWolf_2-1706650604658.png

Click Add Event Mapping and select "Page ready"

HunterSWolf_3-1706650652634.png

Then select your new script (should be at the bottom.) and test it out. 

HunterSWolf_4-1706650747438.png

This will remove the entire section for add any details to your request you may be able to just do one of them but you would have to go deeper in the DOM to find those elements.

 

Thank you!