kobby_adu-nti
ServiceNow Employee
ServiceNow Employee

Since the release of Fuji, we have removed the option to allow end users to alter the size of the font displayed on an instance. The ability to increase and decrease the font size on an instance caused some reflow issues on the Document Object Model (DOM), which in turn would impact the end-user experience. Many users reported spurious UI behavior, such as overlapping fields, overlaying field labels, and unused space whenever a user's web browser was attempting to recalculate the position of DOM elements.

For example:

reflow issue.JPG

Although the ability to modify font sizes was purposely removed from platform, there are use cases where this functionality is still required. That being said, lets take a moment to focus on the alternative approaches to changing the font size within your instance.

Change the font sizes in your web browsers

It would be preferable to utilize your browser's built-in tools to adjust the font size of the text that appear on your instance. Here is how to change font sizes in the web browsers supported by ServiceNow.

Google ChromeChange text, image and video sizes (zoom) - Chrome Help
FirefoxFont size and zoom - increase the size of web pages | Firefox Help
Windows IEChange webpage text size in Internet Explorer
Apple Mac SafariHow to Modify Text Size in Safari - Open Your Safari Browser

Please note these methods will only affect the users machine for which they are configured and the changes will be affective across all sites.

Use an API to alter the 'Document Object Model' (DOM)

This method opens up a wealth of options when it comes to resizing elements and layout displays. However, DOM manipulation is NOT supported by ServiceNow Customer Support and should only be employed by experienced web developers.

Those that do wish to pursue DOM manipulation as an option should review documentation discussing Client Scripts, UI Scripts, jQuery, and prototype JS.

Revert to an old user interface

Prior to Fuji, the font size was controlled by the button Increase and Decrease Font Size (A A). This could be found on the top right of the navigator. Those using newer versions of ServiceNow have the ability revert to the old user interface on the fly to take advantage of this feature. To revert to the old UI, append the following text highlighted in red to your instance URL: <your_instance>.service-now.com/?sysparm_device=desktop.

sysparm_device+parameter.JPG

Please be aware that reverting to the the old UI will only be affective for the users session for which you configured the URL, the user will revert back to the instance configured UI once starting a new user session. Also using an older UI will prevent users from utilizing the newer features released in in UI15/U16.   Going back to the the old interface will expose you to the reflow issues discussed above.

Style sheets containing CSS declarations can also be used to modify the size of fonts displayed on a customized CMS portal using the property font-size. You can find details on how to utilize CSS properties such as font-size documented all over the internet.

Remember, when adjusting the font size of your instance, readability and usability are key. The methods suggested above are diverse, some; such as, changing the font size within the browser, or reverting to the old UI, can be controlled by the end user; whereas, adjusting styles sheets and manipulating the DOM enables developers to enforce specific design aesthetic to the UI and CMS portal. When choosing a method to employ, consider striking a balance between user flexibility and corporate branding.

2 Comments