Removing Service Portal Catalog Item Help tag icons

Mark Roethof · ‎11-13-2019

Hi there,

Did you notice the continuous change of look and feel on the Service Portal SC Catalog Item page? In particular, how the help tag is displayed? The colors, the icons, the expanding. Because we are not interested in the changes which were applied on Madrid and New York, we dug into how to change the widget presented. A short article on how to influence that look and feel a little bit.

Help text

To clarify what this article exactly is about: The help tag icons displayed if a help tag on Variables is applied.

London-Madrid-New York

Let's just visualize the differences between the last three releases. We took out-of-the-box Catalog Item "Item Designer Category Request" as example. Look closely at Variable "Category Description".

London

Madrid

New York

If you like these changes, no worries, just skip this article 🙂 If you agree on removing these additional help tag icons, read on!

Influence the look and feel

A common heard approach is: Clone the out-of-the-box Service Portal widget and edit the Body HTML template or CSS. We are into trying not to clone out-of-the-box widgets. A lot of changes on Service Portal widgets actually already can be made through CSS. For example, through the Portal Theme CSS, or thru the Portal Page Page Specific CSS. In this case, we have chosen the Page Specific CSS on the current Portal Page (SC Catalog Item).

div.m-b-xs {
  display: none; 
}

.help-tag-icon {
  display: none;
}

If you are not aware of how to reach this page: On the Service Portal, open a random Catalog Item which will take you to the SC Catalog Item page. On the SC Catalog Item widget displayed, CTRL+right mouse click, Page in Designer. On the top right select Page button.

The code in the picture shown simply hides the elements which contain these help tag icons. This way you don't need to clone the Service Portal widget. This method is also upgrade prove (tested on London -> Madrid, and Madrid -> New York).

Result

The result of adjusting the Page Specific CSS on the SC Catalog Item page is a little bit cleaner presentation of the variables which have a help tag applied.

---

And that's it actually. Hope you like it. If any questions or remarks, let me know!

👍	If this post helped you in any way, I would appreciate it if you hit bookmark or mark it as helpful. Interested in more articles, blogs, videos, and Share projects on Service Portal I published? - Service Portal

Kind regards,
Mark
2020 ServiceNow Community MVP
2020 ServiceNow Developer MVP

---

lolo3 · ‎12-08-2021

Will this work for Quebec? I have the same problem but it's the Quebec version. Also, i need at to the add "Catalog" and Subcategory to my request. Most in importantly, when the user clicks on the drop down under the category field, want the subcategory field to change with the appropriate options. Please view screenshot . I just need make sure that when user choose Category (hardware) then subcategory field pull in option for the hardware in the Subcategory. In the screenshot it's pulling the wrong data in the subcategory field.

Mark Roethof · ‎12-08-2021

Hi there,

Please post this as a question within the community. You'll likely get more reply posting it as a question, than when you are responding to an article (which is about something else).

Kind regards,
Mark

LJ5 · ‎12-08-2021

Still works great in Rome Patch 1.

lolo3 · ‎12-08-2021

Will this work in Quebec?

lolo3 · ‎12-08-2021

If not pulling in the correctly , what I need to do fix it ? Please help

Richard Bonnier · ‎05-31-2022

Is not working anymore in San Diego? Please, can you have a look? Thanks!

Mark Roethof · ‎05-31-2022

Hi Richard,

Could you try using:

.fa-question-circle {
  display: none;
}

Kind regards,
Mark
2020-2022 ServiceNow Community MVP
2020-2022 ServiceNow Developer MVP

---

LinkedIn
Community article, blog, video list

Richard Bonnier · ‎05-31-2022

Works like a charm! Thanks Mark!

Harsha M V · ‎03-08-2023

Hi @Mark Roethof ,

In Tokyo version, after using below code, still I am able to see the highlighted box and toggle icon in catalog item.
I dont want to see the question mark or either that box feature.

Is there any different code for Tokyo version of Servicenow or do i have to update this code anywhere else to hide that toggle and box feature?

div.m-b-xs {
display: none;
}

.help-tag-icon {
display: none;
}

New Developer_S · ‎12-17-2023

@Harsha M V

Were you able to fix this issue ? I too would like to remove highlighted box and toggle icon (question mark ) in catalog item in service portal.

Can you please provide the solution if fixed ?

TIA

dick linschoten · ‎01-12-2024

hi, additional question on this.

when working with the maintain item feature you have that option as described to put in a helptag

how ever we want to move part to the catalog builder but here you don't have these fields only the instruction text. any idea on how to have this fixed?