ServiceNow's Content Management application has been around for quite some time now. Because of this, there is a mixture of old out-of-the-box content and "newer" content, and distinguishing between the two can be tricky. I believe this is why the Content Management application can be a challenge to master. Not only do you need to know HTML, CSS, JavaScript and Jelly, but you also need to understand the structure of ServiceNow and how the CMS components play together in the application.
My goal is to help you understand the underlying structure of the Content Management application so you can be on your way to creating awesome sites.
The Structure
The following records make up the core components of the Content Management application.
Let's start with the following picture to help conceptualize the core Content Management records.
- A Site record is the parent most record of the Content Management application
- A Site contains 1 or more Pages
- A Page is assigned to 1 and only 1 Site
- A Page contains 1 or more Content Blocks
- A Site may contain a Theme
- A Theme contains 1 or more Style Sheets (CSS)
- A Site may have a global Layout
Site Records
As stated before, the Site record houses all records, such as Pages, that are specific to the site. Just think of your favorite website. It probably contains hundreds, if not thousands of pages. Each Page record is associated with a Site.
The picture above shows a Site record. Let's take a look at the most important fields:
- Name - this is the name of the Site record used for reference within ServiceNow. This will not be displayed anywhere within the actual site.
- URL suffix - this will be the first part of the URL. Think of a file structure that contains folders for the sites, and files for the pages. If you have multiple sites, there would be a folder for each site. Then, the pages would go into the site folders, which would give you something like:
- Site 1
site-1/home-pagesite-1/about-pagesite-1/contact-page- Site 2
site-2/home-pagesite-2/about-pagesite-2/contact-page- Home page, Search page, Login page - these fields allow you to define Pages to the Site record that tend to have a special component to them. ServiceNow will try to help you out with the backend routing when you define these Pages.
- Default layout - this is the Layout that all Pages within the Site will inherit.
- Default theme - similar to the layout, a Page within this Site record will inherit the Style Sheets found within this Theme record.
Page Records
The page record is where things get interesting. A Page may contain Content Blocks. We'll get back to Content Blocks in a bit, but for now just think of them as providing a way to put actual content, or text, on the page. Page records may also overwrite their parent Site attributes, such as Layouts or Themes. This way, if you have a one-off page, you can apply it's own style and structure to just that one Page.
Let's take a look at the main Page fields:
- Name - this is the name of the Page record within ServiceNow. It is not generally referenced within the actual HTML of the site.
- URL suffix - this is the second part of the URL used within the example provided for the Site URL suffix. If you wanted to access this page, which is apart of the Employee Self-Service Site record, the full URL would be:
https://your-instance.service-now.com/ess/main/ - Layout - this field gives you the ability to overwrite the default Site Layout. This will usually be left blank.
- Content theme - just like the Layout field, you may overwrite the default Site Theme. This will usually be left blank as well.
- Content site - the Site record that houses this Page.
- Title - text that will be used within the HTML
<title>element, which shows up on the browser's tab.
Content Block Records
Content Blocks provide a way to add stuff to your page. ServiceNow provides a number of different out-of-the-box Content Blocks. Here are the most common ones:
- Dynamic Content Blocks
- List Content Blocks
- iFrame Content Blocks
- Navigation Content Blocks
- Static HTML Content Blocks
- Header Content Blocks
If you wanted to show all open incidents that are assigned to the current user, then you would use a List Content Block. If you needed to generate dynamic content based on the current user's role, you would use a Dynamic Content Block.
Theme Records
A Theme record is pretty basic. It's just a container that houses 1 or more Style Sheets.
Style Sheet Records
A Style Sheet is where you'll store the CSS a site uses. You may have multiple Style Sheets per site. For example, you could have a Twitter Bootstrap Style Sheet as well as a customer specific Style Sheet. In this case, you would have 2 Style Sheets assigned to 1 Theme.
Layout Records
Layouts provide a cookie-cutter like structure to place content blocks in. ServiceNow provides a number of out-of-the-box layouts, although most of them use HTML tables to define dropzones, which is considered bad practice by today's standards.
Layouts contain Dropzones. Dropzones are areas where a Content Block will go. Let's use another image to help conceptualize this:
Here you can see that the Layout is the outer green box while the Dropzones are the inner green boxes. The blue Content Blocks may be placed inside a Dropzone.
You can create Dropzones by using the following HTML:
The most important piece is id="dropzone0" and dropzone="true". If we wanted to follow today's best practices and put our Dropzones on div elements, we could do so like this:
You can add Content Blocks to Dropzones by going into a Page record, and clicking the Edit Page UI Action, where you will then be taken to a page similar to this:
You can then click the Add Content link to add Content Blocks to a Dropzone defined within the Layout.
Conclusion
I hope this article has helped with understanding the main records that comprise the Content Management application within ServiceNow. Stay tuned for additional CMS articles that will go into more detail on Layouts, Content Blocks and Jelly!