- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
03-22-2015 08:59 PM
Theres' a nice new method in Fuji for adding field decorations - GlideForm (g form) - ServiceNow Wiki. I was just wondering if anyone knew of a way to add our own custom icons to the list of available ones:
I was thinking of replacing the OOB VIP highlighting method with this "safer" method so I wanted to add a B/W version of the VIP icon to this list.
Thanks
Solved! Go to Solution.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
03-24-2015 04:34 AM
Hi Jim
Unfortunately, the new UI that was introduced in Fuji is a lot more restricted than what we were used to in the pre-Eureka releases.
What I can advise you is that the symbols are based on Web Fonts (in this case retina_icons) and the styling is managed in the internal CSS. So you are restricted to the available character set by using the icon-name format for the class name:
<i class="icon-name"></i>
Example icons are:
icon-cart
icon-catalog
icon-edit
To get a good idea on the available icons you can inspect retina_icons.css:
https://instancename.service-now.com/styles/retina_icons/retina_icons.css
or you can look at a "preview" page for the icon by navigating to:
https://instancename.service-now.com/styles/retina_icons/retina_icons.html
Beyond that, from the top of my head, I can only think of uploading your own images and use a UI Script to look for your made up classes (e.g. my-icon-vip) that would replace them with the uploaded image and/or play with the styling of the field_contributions class for more control over the retina_icons. Of course this is not using a "safe" route and would be your own customisation.
Hope that helps
Shahid

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
05-08-2015 06:15 AM
Thanks for that, Shahid.
I had seen the glyphicons website previously. It appears Fuji's internal CSS only includes a subset of the Glyphicons-Halflings font-- There are 200 glyphicons listed in the internal CSS stylesheet, but the Glyphicons site shows 260 icons in that set. So users may not be able to utilize some of the icons they see on the website...
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-08-2015 10:01 AM
Thanks Jim. One quick question, how can we add the icon next to some of the incident forms, and display them if some of the field value changes ?

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
06-08-2015 10:34 AM
Hi Ravali,
You should be able to apply these icons to fields on the incident form by using an onChange client script.
Let's say you wanted to display the star icon next to the Caller ID field if the incident is critical. Create an onChange client script that monitors the Priority field and decorates the Caller id field under the proper circumstances:
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
if (isLoading || newValue == '') {
return;
}
try {
if(newValue == 1) { //Critical priority
g_form.addDecoration('caller_id', 'icon-star', 'P1 Incident'); //display the star icon next to the Caller ID field
}
}
catch(error) {
jslog('>>>Runtime error: ' + error);
}
}