Formatting within Journal fields using HTML & [code]

[dylan_lindgren]

Most fields in ServiceNow store a single inputted text value. To view previous values one needs to go into the record's audit history. Journal fields are different, in that all previous values of this field are shown as distinct posts within the Activity Stream timeline. This allows them to be used as a method of communication with users and coworkers about the current record, and also as a log of the history of the record.

With journal fields, the content of notifications are commonly based on the newly updated value of the journal fields, and that they only accept input as plain-text. Out of box, there are two journal fields on the task table:

• Additional comments [comments]
• Work notes [work_notes]

Adding HTML code in Journal fields

As with most fields, if the new value contains HTML code it is escaped. For example, if you were to type the below valid HTML code in a journal field:

It would appear in the Activity Stream as follows:

The way this is done is by replacing any characters in a journal field that could be interpreted by a browser as HTML with it's HTML entity code.

For example, HTML tags make use of < and > to declare the start and end of a tag. ServiceNow replaces these with their HTML entity code &lt; (less than) and &gt; (greater than), meaning that when the browser reads the code it doesn't get processed as a literal < and >, and therefore does not mistakenly become a HTML element.

Using the [code] tag in Journal Fields

Text wrapped in [code] tags bypasses the escaping process described above, and will instead be rendered as HTML. For example, the same input used above, but wrapped in [code] tags:

Will appear in the Activity Stream as follows:

Note that the <blockquote> tags are now being interpreted as HTML elements, and are not being escaped. Also note that you can use multiple sets of [code] tags within a single journal entry.

Formatting styles in Journal entries

There are a number of HTML elements that you can use to add styles to your journal updates. Some examples are shown below:

Style	Tag(s)	Example Journal Entry
Italic	<em>	[code]This text is <em>italic</em>[/code]
Strikethrough	<strike>	[code]This text is <strike>strikethrough</strike>[/code]
Code (inline)	<code>	[code]Check the script include <code>KBKnowledgeBase</code>[/code]
Code (block)	<pre><code>	[code]<pre><code>function foo() {<br/>       console.log('bar');<br/> }</code></pre>[/code]
Blockquote	<blockquote>	[code]<blockquote>This is a quote</blockquote>[/code]
Hyperlink	<a>	[code]<a href="https://www.servicenow.com">ServiceNow.com</a>[/code]
Bullet points	<ul><li>	[code]<ul><li>Item 1</li><li>Item 2</li><li>Item 3</li></ul>[/code]
Numbered lists	<ol><li>	[code]<ol><li>Item 1</li><li>Item 2</li><li>Item 3</li></ol>[/code]
Header	<h3>	[code]<h3>This is a header</h3>This is normal.[/code]

The HTML elements shown above do not contain any styling information - that is left up to ServiceNow's CSS stylesheets, and the browser's user agent stylesheet. Therefore, as the styles rely on ServiceNow CSS, the way they are presented to users may change after future user interface upgrades.

The above examples show how the HTML elements are displayed in the Istanbul release of ServiceNow, running UI16. See kobby.adu-nti demo in Formatting the Journal Field with the [code] tag