Snippets

Snippets are chunks of reusable content or code that can be placed within articles, categories, and even your theme's HTML. The content of the snippet can be as simple as a single word or sentence, or as complex as a JavaScript function that performs an action on whatever page it is used.

For example, you could create a snippet that contains your company's copyright information. Wherever you want the copyright to appear, instead of typing it out again and again, you would use the snippet's merge code in its place. 

When the page displays, the snippet merge code is replaced with the snippet's content. When you need to update your copyright information, you can edit and update the snippet content, and the changes will be automatically reflected wherever the snippet was used.

Text within snippets is not indexed for search.

All created snippets are stored in the Snippets library. To access your Snippets library, in the left navigation, select Snippets. The Snippets library opens:

Sample snippet library layout

Within the Snippets library, you can:

1. Create new snippets.
   
2. Search for existing snippets using words in the snippet's Name and Description.
3. Select any snippet to open it in edit mode.
4. Copy or delete a snippet by selecting the gear cog icon in the upper right corner of the snippet's card.

You can choose to create a snippet from scratch or to copy an existing snippet to use as a starting point.

To create a snippet from scratch:

1. In the left navigation, select Snippets. The Snippets library opens.
2. Select + Create New Snippet.
3. Enter a Snippet Name. This is how the name will appear in the Snippet Library and in snippet look-ups.
4. The Merge Code Name will auto-generate from the Snippet Name, but you can edit it if you'd like to. The Merge Code Value is generated from the Merge Code Name. This is the value you'll enter in your articles, categories, or theme when you use the snippet.
5. Enter a Snippet Description. This will help describe what your snippet does to other authors (and may help remind you if you forget). This description is only visible in the Snippets library and the Snippet Details pages.
6. Enter your Snippet Content.
   1. If your snippet is used to display text (as our copyright is), type and format the text you want to display directly in the WYSIWYG Editor. 
   2. For code-based snippets containing scripts or style tags, or for in-line text snippets, select the Snippet Content dropdown and select Code Editor. This toggles the editor to a simple code editor where you can enter raw HTML, scripts, CSS, and so on:
      Sample gif showing the toggle to Code Editor. Hover over to play.
      
7. Optional: In the right column, choose from these Visibility options:
   1. Hide from PDFs: This prevents the snippet from loading in PDFs. It's useful this is a script or other functionality that won't work in a PDF.
   2. Include snippet content in article blurbs: Article blurbs are used in search results and on category landing pages. If your snippet contains text content you want displayed, check this box. If it's a script, style, or other functionality, leave it unchecked.
8. Optional: If you're using Reader Groups and only want this snippet to be visible to members of certain groups, check the boxes next to those groups in the Restrict to Reader Groups.
9. Once you've finished formatting your snippet, select Create. Your snippet's created in the Snippets library and is available when someone tries to Insert Snippet in an article or category.

To help with content auditing and visibility, KnowledgeOwl tracks when you save an article or a custom content category containing a snippet's merge code. We save this information in the snippet's References so you can quickly locate all the places where it's used.

When you have a snippet open for editing, the righthand menu displays this References section beneath the Restrict to Reader Groups section:

Sample snippet References section

Select View details... to open the References modal.

This modal displays a full list of the articles and custom content categories that reference this snippet. Articles include a badge that shows the article's publishing status:

Sample References modal

The links open the article and custom content category for editing.

What if you want to test out some tweaks to an existing snippet? Instead of trying to copy the whole thing yourself, copy your existing snippet!

To copy an existing snippet:

1. In the left navigation, select Snippets. The Snippets library opens.
2. Find the snippet you want to use as a starting point. You may need to search.
3. Select the gear cog icon in the upper right of the snippet's card.
4. Select Copy:
   
   Select the gear cog icon > Copy.
   
5. A confirmation modal opens. Make sure the name of the snippet you're copying is the one you meant to select. Then select OK.
   

Snippets need to have unique unique merge code names, so we'll automatically add "Copy" to the new snippet, but you can edit the name and merge code to whatever makes sense to you.

To add a snippet to your content, you'll need to add its Merge Code Value--this is a value in double curly brackets, like {{snippet.mySample}}.

You can add snippets to:

• Articles: Use the editor control to Insert Snippet to quickly add snippets to articles. Refer to the instructions below.
• Categories: For custom content categories, use the editor control to Insert Snippet to quickly add snippets to articles. Refer to the instructions below.
  • If you need to add a snippet to a category description or meta description, you'll need to manually copy the merge code value to enter it.
• Customize > Style (Custom HTML & CSS) > Customize HTML, CSS, and JS > Custom HTML. You'll need to manually copy the merge code value to enter it.
  • Add snippets to Custom HTML > Body to display their content everywhere, like a footer or copyright statement.
  • Add snippets to Custom HTML > Article to add them to all articles.

To add a snippet in the article or custom content category editor:

1. Select the Insert Snippet control (two gear cogs icon) from the editor toolbar:
   The Insert Snippet control in the editor
   
   The Add Snippet modal opens.
2. Enter part of the snippet's name; the window will autosuggest snippets as you type.
3. Select the suggestion that matches it. Once you select a snippet, the Snippet Description and the first few lines of Snippet Content display so you can be sure you've selected the correct snippet. (No Description displays if the snippet you've entered doesn't have one.)
4. Once you're sure you've selected the correct snippet, select Insert Snippet. This closes the modal and inserts the snippet's Merge Code into your article, like this:

   Lorem ipsum dolor sit amet, duo utamur copiosae torquatos ad, sale virtute vituperata ne cum, id quo aliquando adolescens argumentum.
   
   {{snippet.copyrightInfo}}

5.  Once you Save your changes, a reader will see the body of the snippet (if it's text) or the results of the code in it. For example, here's our copyright Info snippet:

Snippets don't save a full revision history like articles do, but you do have the option to Revert to previous save. This feature tracks the last three saves of the snippet so you can roll back changes to one of those previous saves. (It works similarly to our Undo changes to Settings > Style feature.)

Reverting to a previous save will roll back any changes to:

• Snippet Name
• Merge Code Name (and, by extension, the Merge Code Value)
• Snippet Description
• Snippet Content (whether in Code Editor or WYSIWYG Editor)
• Visibility settings (Hide from PDFs and Include snippet content in article blurbs)
• Any Restrict to Reader Groups selections

To revert to a previous save, you must have an Editor or Writer role, or a custom author role with the Edit snippet permission:

1. In the left navigation, select Snippets.
2. Open the snippet you'd like to recover changes on.
3. In the right column, select Revert to previous save.
   
   The Previous saves modal opens.

   Help, I don't see Revert to previous save!
   If you don't see this link in the upper right, it means we don't have a record of any previous saves to revert to. This can happen if:

   • The snippet was created before 30 December 2023 and has been saved 0-1 times since then.
   • The snippet was created after 30 December 2023 and has only been saved once after creation.
4. In the Previous saves modal, select the previous save you'd like to revert to from the Previous Saves dropdown.
   
   • We store up to three recent saves for each snippet. These saves will be identified by the date/timestamp of the save, with the author who saved the changes in parentheses, for example: 01/09/2025 12:48:25 pm EST (Linus Owl).
5. Once you're sure you've selected the Previous Save you want, select Revert.
6. All of the snippet's details will be updated to the reverted save. You must Save the snippet for these changes to go live.

There are a number of great use cases for snippets:

• Footers or other statements that need to be used a lot of places, such as confidentiality statements.
• Brand names or terms that may change frequently: make a snippet for that term and only reference the snippet instead of the full term in all your documentation. When the term needs updating, update only the snippet and all your documentation is updated!
• Specialized sections for articles, such as Article Table of Contents.
• Code to handle unusual formatting or to provide a set of styles for individual articles that differs from your general knowledge base styles.
• Adding third-party scripts, embeds, or functionality.

Refer to Snippet best practices for more details on how to handle some of these use cases gracefully.

Snippets can be incredibly powerful. Here are some general best practices for making good use of them.

The most common use cases for snippets are:

• Code or CSS
• In-line text
• Reusable content

Below, we've captured some general guidance and best practices for each use case, as well as some examples to help guide you in your snippet journey. Contact us if you have questions about anything not detailed below!

Code or CSS

One of the best use cases for snippets is to add HTML, code, CSS, or any combination of those.

Why you might want to do this:

• The snippet editor will support complex HTML that the article editor strips out on-save.
• You control where snippets are added, so it's a great way to add functionality or styling to a very specific, manually-selected subset of your documentation.
• Snippet references are tracked, so you can see at a glance where this code or CSS has been used, which makes auditing much faster.

For straight HTML, you can use the Code Editor for total control, or use the WYSIWYG editor to construct the HTML you need.

Best practices for adding code or CSS to snippets:

1. In the Snippet Content section, be sure that Code Editor is selected, not WYSIWYG editor.
2. Don't ever toggle back to the WYSIWYG Editor view, as that toggle applies the same extra-vigilant HTML parsing that the article editor does.
3. To add scripts, be sure you include opening and closing <script> tags.
4. To add code from other systems for embeds, etc., copy whatever code they give you exactly and paste it in. You don't need to add <script> tags if they aren't already in the embed.
5. To add CSS styles, be sure you include opening and closing <style> tags.

Here are some examples of those best practices at work:

Script and style

Some snippets can contain both scripts that do things and a style section to do CSS, like the snippet created in Add search to the glossary page.

HTML and script

We have a snippet to create a Subscribe button for our custom content categories. This includes HTML to add the button merge code in a paragraph, as well as a script to insert the button where we want it.

Third-party script and style

Some third-party tools will provide specially-formatted HTML to add functionality. The regular article editor will generally strip these out because they aren't part of the HTML spec. Using a snippet for that special script is great--and you can still tuck a style section in for some extra styling of that element or others. For example, we embed our Zapier integration in our documentation. Zapier provided us with a pre-built script for this, but we also use some CSS to hide the article title. So we use Zapier's code and also include a style section to add our custom CSS.

In-line text

To use a snippet to add in-line text (such as a text variable you want to use various places), follow these general best practices:

1. In the Snippet Content section, be sure that Code Editor is selected, not WYSIWYG editor.
2. Add your in-line text directly into that Code Editor, with no paragraph or other tags around it.
3. Don't ever toggle back to the WYSIWYG Editor view, as that toggle will apply some auto-formatting like the article editor, and your text will get wrapped in a paragraph.

Example

For example, we have a set limit on the size of files you can upload to KnowledgeOwl. Since that limit might change at some point in the future, we use a snippet to provide the text, so if we update it, we only have to update the snippet and every article referencing it will update too. The Snippet Content for this is in Code Editor and just entered directly with no HTML:

Reusable content

The last major use case for snippets is that they can contain content you might want to reuse. Snippets can have reader group restrictions different from the article where they're embedded, so this can sometimes be a way to show content to some folks but not others.

Best practices for using snippets for reusable content include:

1. Be sure a topic article wouldn't be a better choice.
2. Make sure it's content you don't expect to turn up in search; snippet content is NOT indexed for search (topic article content is, though).
3. We recommend using the WYSIWYG Editor for the Snippet Content to be sure the content looks and is laid out exactly how you want it.

The best use cases for this include things like:

• Callouts or alerts that you want to standardize/reuse and don't need indexed for search
• Copyright statements or other disclaimers