What if, instead of showing Related Articles in all articles, you just want to show them in specific articles?
To do so, you'll follow a three-step process:
- Remove the merge code that generates the list from your Custom HTML. Refer to Step 1: Remove the merge code from Custom HTML.
- Create a snippet to format a Related Articles section with the merge code. Refer to Step 2: Create a snippet.
- Add that snippet to articles. Refer to Step 3: Use the snippet.
Refer to the more detailed linked instructions below.
Step 1: Remove the merge code from Custom HTML
First, we'll remove the merge code and any headings or surrounding divs:
- Go to Customize > Style (HTML & CSS).
- In the Customize HTML, CSS, and JS section, select Custom HTML.
- Select Article from the Select HTML section to edit dropdown.
- Remove the
<div class="ko-related-articles text-center">completely. So if our Custom HTML originally looked like this:<div class="hg-article"> <div class="hg-article-header"> <h1 class="hg-article-title">[article("title")][article("action_icons")]</h1> <div class="metadata"> [article("required_reading_flag")] [translation("article:last-modified-on-label")] [article("date_modified")] </div> </div> <div class="hg-article-body"> [article("body")] </div> <div class="hg-article-footer clear-both"> [article("required_reading_acknowledgement")] <div class="ko-related-articles text-center"> <h3>[translation("article:related-articles-heading")]</h3> [template("related")] </div> [template("rating")] [template("comments")] </div> </div> - We'd remove rows 15-18, so our code would then look like this:
<div class="hg-article"> <div class="hg-article-header"> <h1 class="hg-article-title">[article("title")][article("action_icons")]</h1> <div class="metadata"> [article("required_reading_flag")] [translation("article:last-modified-on-label")] [article("date_modified")] </div> </div> <div class="hg-article-body"> [article("body")] </div> <div class="hg-article-footer clear-both"> [article("required_reading_acknowledgement")] [template("rating")] [template("comments")] </div> </div> - Be sure to Save your changes.
Oops?
If you deleted too much or something went wrong, Undo changes to Customize > Style. If you made the change too long ago to undo, refer to our Default Article HTML to find the HTML you need to re-add or contact us for help.
Step 2: Create a snippet
Next, create a snippet that will format the section and add the merge code:
- In the lefthand navigation, go to Snippets. The Snippets page opens.
- Select + Create New Snippet to create a new snippet. If you're unfamiliar with creating snippets, refer to Create a snippet for more details.
- Enter a Snippet Name, like
Related Articles section. - Enter a Snippet Description, like
Add this snippet at the bottom of any article that you want to display the Related Articles section in. - In the Snippet Content dropdown, select Code Editor:
- Copy the code below and paste it into the Code editor:
<div class="ko-related-articles text-center"> <h3>[translation("article:related-articles-heading")]</h3> [template("related")] </div> - Optional: This code uses our Customize > Default text to set the heading for the Related Articles section. To adjust the heading from "Related Articles", edit the Related articles list heading default text string in the Article knowledge base section. Refer to Section breakdown: Article for more details on the text strings available in articles; refer to Add or edit your own text string for instructions on adding your own custom text string.
- Optional: If you'd like to make further changes to the layout or wording of this section, toggle back to the WYSIWYG editor using the Snippet Content dropdown. We recommend keeping the div wrapped around the whole section to guarantee the text stays centered.
- In the right column of the snippet editor, in the Visibility section, check the box to Hide from PDFs.
- Once you're done editing the snippet, select the Create button to finalize creation.
Step 3: Use the snippet
With your snippet created, any author can now add that snippet into articles where you'd like the Related Articles section displayed.
If you're unfamiliar with adding snippets to articles, refer to Add snippets in content for detailed instructions.
You can also add the snippet merge code into a topic display category Category Description or the body of a custom content category.