Set up Related Articles

Want to save you or your writers some time? Let the knowledge base automatically suggest up to ten related articles, either from across the entire knowledge base or only from within the same top-level category as the current content.

This can be a great time-saving feature if you've inherited a knowledge base or imported content from another tool, before you've had a chance to manually suggest related articles.

To enable automatic Related Articles:

1. Go to Customize > Website.
2. In the Links and behavior section, under Related article suggestions, check the box to Automatically suggest related articles based off of the article titles.
   Check the box to Automatically suggest related articles based off of the article titles
   
3. Optional: Related Articles will automatically suggest articles across the entire knowledge base. If you would like to only suggest related articles from within the same top-level category as the current article or category, check the box to Only automatically suggest articles from the current top level category. (For example, if we use this setting for this page, you'd only see automatic related articles from within the Features category.)
4. Optional: If you still plan to manually add some related articles, we recommend you check the box to Backward suggest articles. Refer to Backward suggest Related Articles for more information.
5. Optional: Use the Related articles limit dropdown to change how many automatically-suggested related articles are displayed. Refer to Set the number of Related Articles to automatically display for more information.
6. Once you've finished making your selections, be sure to Save your changes.

If you're using manually suggested Related Articles, you can save yourself a little bit of work using a knowledge base-wide setting to Backward suggest articles.

When you add a Related Article manually, you're only editing the article you're viewing. To create a perfect experience, you'd also need to go edit the related article to add the first article as related.

The Backward suggest articles setting basically does this for you.

For example, I edit Article A and add Article B as a related article.

• Without backward suggest, if a reader opens Article B, the Related Articles section won't include Article A unless I specifically add it there.
• With backward suggest, if a reader opens Article B, the Related Articles section will include Article A, even though I never specifically added it there. Article A won't show in the article editor for Article B, but it will show in the live knowledge base.

Basically, this setting makes the live knowledge base mirror all related article relationships automatically.

Backward suggestions are disabled by default. If you'd like to turn them on:

1. Go to Customize > Website.
2. In the Links and behavior section, under Related article suggestions, check the box to Backward suggest articles which list the current articles as related.
   Check the box to Backward suggest articles which list the current article as related
3. Be sure to Save your changes.

By default, our knowledge bases are set to automatically display five Related Articles.

You can set this to any number between 1-10:

1. Go to Customize > Website.
2. In the Links and behavior section, under Related articles limit, use the dropdown to select the number of articles you'd like the section to display (1-10).
3. Be sure to Save your changes.

Once you've added manual Related Articles to your content, you may find the automatic suggestions to be too noisy or vague.

If so, you can turn them off across your entire knowledge base:

1. Go to Customize > Website.
2. In the Links and behavior section, uncheck the box to Automatically suggest related articles based off of the article titles.
3. Save your changes.

Articles and categories will now only display related articles that you've manually added. Refer to Add Related Articles for instructions on manually adding related articles.

What if, instead of showing this in all articles, you just want to show Related Articles in specific articles?

You can remove the merge code that generates the list from your Custom HTML, create a snippet to format a Related Articles section with the merge code, and then add that snippet to articles. More detailed instructions follow:

Step 1: Remove the merge code from Custom HTML

First, remove the merge code and any headings or surrounding divs from Settings > Style > Custom HTML > Article.

If you're unfamiliar with this HTML, see Default Article HTML, rows 26-29 for our default placement to help you find it so you can remove it.

Step 2: Create a snippet

Next, create a snippet that will format the section and add the merge code:

1. Create a snippet. We recommend using "Related Articles section" or something similar as the Snippet Name.
2. In the Snippet Content dropdown, select Code Editor.
   
   Sample gif showing the switch to Code Editor. Hover to play.
   
3. Copy the code below and paste it into the Code editor.

<div class="ko-related-articles text-center">
    <h3>Related Articles</h3>
    [template("related")]
</div>

4. You can toggle back to the WYSIWYG editor using the Snippet Content dropdown if you'd like to make further changes to the Related Articles header, add explanatory text, etc. We recommend keeping the div wrapped around the whole section to guarantee the text stays centered, though!
5. In the right column of the snippet editor, in the Visibility section, check the box to Hide from PDFs. Here's what your snippet might look like now:
   Sample Related Articles snippet, though your header likely looks different!
6. Once you're done editing the snippet, select the Create button to fully create it!

Step 3: Use the snippet

With your snippet created, you can now add that snippet into the articles where you'd like to display this section.

See Add snippets in content for full steps on how to do this.

You can also add the snippet merge code into a topic display category Category Description or the body of a custom content category!

If you have a customized theme, the Related Articles section might have been removed entirely. Below, we offer instructions on how to re-add it to your main article body or the right column. Choose the implementation that makes sense for you!

Add the Related Articles List to all articles

If for some reason you don't see the Related Articles list, it's probably previously been removed in custom theme work. You can place the related articles merge code in the HTML of all articles to get it back. See Default Article HTML, rows 26-29 for our default placement.

Add the Related Articles List to the right column of your knowledge base

By default, we also include the Related Articles in the right column (which is generally only used/displayed in our older themes).

If you're using one of our older themes that displays the right column and you're not seeing Related Articles there, you can grab some HTML from our Default Right Column HTML to re-add it, see rows 14-16.

If you're using Related Articles, there might be specific articles where you don't want the section to display. For example, perhaps this article contains your company W9 and everything it's suggesting as related is product documentation.

For this scenario, create a snippet that will hide the Related Articles section and then add that snippet to the specific articles where you want to hide the section.

First, create the snippet:

1. In the left navigation, go to Snippets. The Snippets library opens.
2. Select + Create New Snippet.
3. Enter a Snippet Name, like "Hide Related Articles."
4. Enter a Snippet Description, like "Use this snippet in articles and custom content categories to hide the Related Articles section."
5. Select the Snippet Content dropdown to switch to Code Editor:
   
   Gif showing the Snippet Content toggle to Code Editor. Hover over to play.
6. Copy the code below and paste it into the snippet's Code Editor:
   

   <style>
     /* Hide related articles */
     .ko-related-articles {
       display:none;
     }
   </style>

7. Select Create.

Now that your snippet exists, any of your authors can add it to an article using the Insert snippet option.

You can add some code to hide the Related Articles section when there are no Related Articles present.

1. Go to Settings > Style.
2. Click on the Custom HTML tab.
3. Select Article from the dropdown.
4. If your Related Articles section appears at the bottom of all articles, copy this code. Otherwise, skip to step 5:

   <script>
     //If Related Articles section at bottom of the article has no related articles, hide the section
     $(function() {
       if( $('.ko-related-articles ul li:eq(0)').text().trim() == "None" )  
         $('.ko-related-articles').hide();
     });
   </script>

5. If your Related Articles section appears in the right hand column of all articles, copy this code:

   <script>
     //If Related Articles section in the righthand column is empty, hide the section
     $(function() {
       if( $('.related-panel ul li:eq(0)').text().trim() == "None" )  
         $('.related-panel').hide();
     });
   </script>

6. Paste the code you copied above into the bottom of the Article Custom HTML code editor. For example:
   
   Example of the script added to hide the empty Related Articles section at the bottom of articles
7. Be sure to Save your changes.

You can add some code to hide the Related Articles section when it contains 1 or 0 articles.

To do so:

1. Go to Settings > Style.
2. Click on the Custom HTML tab.
3. Select Article from the dropdown.
4. If your Related Articles section appears in the right hand column of all articles, copy this code. Otherwise, skip to step 5:

   <script>
     //If Related Articles section in righthand column has 1 or 0 articles, hide the section
     $(function() {
       if( $('.related-panel ul li').length < 2 )  
         $('.related-panel').hide();
     });
   </script>

5. If your Related Articles section appears at the bottom of all articles, copy this code:

   <script>
     //If Related Articles section at bottom of article has 1 or 0 articles, hide the section
     $(function() {
       if( $('.ko-related-articles ul li').length < 2 )
         $('.ko-related-articles').hide();
     });
   </script>

6. Paste the code you copied above into the bottom of the Article Custom HTML code editor.
7. Be sure to Save your changes.