I recently found the need to create a fully custom UI page, that didn't involve using the framework page template. The user interface had to be dynamic and easy to identify problems, tasks and source code changes that we need to prioritize.
I put together a tree map visualization for our team that gives us an easy way to see:
- Source Code changes
- Closed Problems
- Open Incident Tasks
I put it up on a TV we have hanging over our team area at ServiceNow and it constantly refreshes with the latest changes so we always know how old something is and what category it is under. It looks really cool if I do say so myself.
I modeled the UI page after newsmap.jp . The size and color of the boxes represents the category and age of each item.
Let me know if this is something you are interested in getting more information on! Maybe I'll detail the project in another blog post and include the source code.
Making a UI page without using a framework page template
Before I even started to build the user interface, I knew I didn't want all of the platform html, javascript, and CSS wrapping that came with using the regular framework page template. I wanted this to be a very customized UI. In fact, I wanted total control over everything in the page source.
The Glide platform wraps every UI page in a standard html_page template which gives you everything from basic CSS to UI scripts. You can see that here:
The key to building it on your own: ?sysparm_direct=true
To make a UI page without that page template you can add ?sysparm_direct=true when you request your UI page. In this case: instance.service-now.com/my_ui_page.do?sysparm_direct=true.
Easy enough yes? Let me know with a comment if you would like me to post a second blog to follow up with this that includes the source code!
33 Comments
