This is Part 2 of my ServiceNow CMS + Twitter Bootstrap series. Below are the code examples you will need as explained in the video: cms_menu: [crayon-5cb8c57306d85513549929/] cms_menu_bootstrap_nav [crayon-5cb8c57306d8f148752991/] Layout Includes: [crayon-5cb8c57306d98500367938/] jQueryFix: [crayon-5cb8c57306d9d172010638/]
In the Wiki you will find solutions that include updating OOB Macros or UI Pages, however this will obviously cause those files to be skipped during the next upgrade. So how do you go about updating UI Pages and Macros (or other records) without future upgrades being impacted? The answer is actually quite simple. I discover this little nugget in the Wiki: By default, the Active field on a tracked table is treated as update_exempt even if the attribute is not present (starting with the Calgary release) This means that if we clone the original record, set the original record to "active=false", then we can continue to make changes to the copy record without affecting the upgrade process. The only thing to note is after an upgrade you will want to check the difference between the files so in the event there was a change, you can manually upgrade your updated record.
This may not seem so exciting at first, but once you realize the potential of this technique the results can be pretty powerful. It's no secret that a lot of content in ServiceNow's ESS Portal lives inside iframes. I don't want to get into why iframes suck or why having UI Pages and forms from the main interface showing in CMS is not ideal... so I'll just assume you've used it enough to understand why it's a problem. This is far from a complete solution, but it highlights one technique that could be used to get rid of those pesky iframes as it pertains to UI Pages. One of the challenges is that UI Pages usually need to live in both the CMS and the main interface. So the trick is to figure out how to distinguish between the two. The answer to that is in the URL that is used. If you visit: [instance]/kb_home.do it's loading the UI page as normal. However if you insert "ess/" in front of the ui page name ([instance]/ess/kb_home.do), it will also load in the style sheets from that CMS site. The "ess" refers to the "url_suffix" field on the site. It will also populate a new variable called $[current_site], which really is the GlideRecord of the site record based on the url_suffix. What this allows us to do is distinguish between different sites and the main UI. Consider the following code: [crayon-5cb8c57309c71113625712/] In this example, if we had a header defined in a UI Macro included on our site, we could now also include that header (or footer, or custom markup) on any UI page when used with our site. This essentially removes the need for using iframes. Now it also opens up another can of worms, such as: instance upgrades, and modifying OOB records. However in my personal experimenting I have been able to use this method to bring the full service catalog and knowledge base into a CMS site, without using any iframes, and without causing upgrade issues. It does take some tinkering, but it's doable with a little bit of work. To start I would definitely suggest cloning the UI pages and experimenting with the copy. With this method we're really just styling UI pages to look like a CMS site, there are many other ways of doing it and I've experimented with several with great results. However this method is fairly quick to get you started. I'd love to hear your feedback, and let me know if you have any questions.
The "content_page" object is a scriptable java object called 'GlideContentPage'. In a script you can simply do: [crayon-5cb8c5730edde762629412/] Which will get you access to the following functions: getSiteID getID getURLSuffix getParentPage getName getDescription getMeta getTheme isValid getTitle getModelTable getModelID getDefaultLayout cloneable isFrameBuster
Having built over a dozen ServiceNow ESS portals, I finally had enough of the issues and limitations and decided to do something about it. What resulted was a month long effort of enhancing the CMS framework to function more like WordPress or other content management systems. I set out with some basic goals: Follow best practices Use semantic HTML & CSS Responsive layouts for mobile & tablet Avoid using iFrames Don't touch OOB Macros & UI pages To accomplish these goals I ended up having to add on quite a bit of functionality such as: Custom content types Header & footer templates Live search Event driven notifications Bring UI pages into CMS Form content blocks In this video I do a quick demonstration of these enhancements and our latest theme: "Orebro".