Override default formatting for knowledge articles in the fulfiller UI?

[cynlink1]

When I use a custom "IT Procedure" template that has default content, the template's formatting applies correctly and works well. However, when I add new text to the article, it does not match the template's styling. As a result, I have to manually format the new text to match the font, size, colors, etc.

After applying the template, new numbered lists display numbers using a default style in ServiceNow that doesn't always match the formatted text. I can update the source HTML to fix the numbers, but it's time-consuming. ServiceNow Support has stated that the requested behavior is not possible. I will have to continue fixing the format for headings, paragraphs, and numbered lists when adding new text to my knowledge articles.

I hope someone has found a creative way to work around the default system formatting. The desired formatting for my knowledge articles is as follows:

- Header 1: Calibri, 18, Blue (0, 45, 114), Bold

- Header 2: Calibri 14, Blue (0, 45, 114), Bold

- Header 3: Calibri, 12, Blue (0, 45, 114), Bold

- Paragraph: Calibri, 12, black

- Numbered lists: Calibri, 12, black (numbers and text)

I also tried to include a style in the template, but it didn't work as expected. Please share any success stories if you have them. Thanks, Cyn

Example style:

<style>
  h1 { font-family: Calibri; color: #2E74B5; font-size: 18pt; font-weight: bold; }
  h2 { font-family: Calibri; color: #2E74B5; font-size: 14pt; font-weight: bold; }
  p { font-family: Calibri; font-size: 12pt; color: black; }
  li { font-family: Calibri; font-size: 12pt; margin-bottom: 10pt; color: black; }
</style>

[Slava Savitsky]

When you say "it didn't work as expected", what do you mean exactly? Could you please describe the outcome more precisely?

In the past, I was able to add padding to table cells inside knowledge articles by inserting the following CSS code into the article:

<style>
    article td, article th {
        padding: 0.4rem;
    }
</style>

Maybe you need to be more specific with your CSS selectors. Try adding "article" like this:

<style>
  article h1 { font-family: Calibri; color: #2E74B5; font-size: 18pt; font-weight: bold; }
  article h2 { font-family: Calibri; color: #2E74B5; font-size: 14pt; font-weight: bold; }
  article p { font-family: Calibri; font-size: 12pt; color: black; }
  article li { font-family: Calibri; font-size: 12pt; margin-bottom: 10pt; color: black; }
</style>

If that doesn't help, try !important property.

[Thomas Bohan]

That works in the html of the content of that instance, but if you could add the CSS Selectors to the field style of the Active Template Field to make it global across all articles using that Article Type, that would be much better rather than having to add it explicitly to each article field instance. I've tried adding the CSS code to the field but it doesn't work.

The "Heading Style" value set the style for H3 and the "Field Style" sets the style <section> style.

It would be great if you could override these with a CSS file.