Hide tags from Search Results

KnowledgeOwl search results will automatically display all tags assigned to a given article :

Sample of Tags showing in Search Results You can add some code to hide tags from search results in a few different ways:

  • Hide the Tags label and all tags from Search Results
  • Hide specific tags from Search Results
  • Hide all tags containing specific text from Search Results (such as prefixes, suffixes, etc.)
  • Hide the majority of tags and show only specific tags in Search Results

See below for instruction on each.

Note: these solutions will hide the tags from Search Results. Tags will still appear in the search dropdown list if readers begin their search with the ":" used for tag searches.

Hide all tags and the Tags label from Search Results

To hide the Tags: label and all tags from Search Results:

  1. Go to Settings > Style. Be sure you are in the Custom CSS section.
  2. Copy and paste this code exactly into your Custom CSS:
    /* Hide Tags label and all tags from search results */
    .ko-tags-container {
      display: none;
    }
  3. Click Save.

This will hide the entire Tags section from Search Results.

Note: this will hide the tags from Search Results. Tags will still appear in the search dropdown list if readers begin their search with the ":" used for tag searches.

Hide specific tags from Search Results

If you use tags for internal purposes, you may want to hide those Tags from Search Results while still displaying the rest of your tags. To hide specific tags from your Search Results:

  1. Go to Settings > Style. Be sure you are in the Custom CSS section.
  2. Copy and paste this code into your Custom CSS.
    /* Hide a specific tag from Search Results 
    Replace "hidden-tag" with the tag text */
    .ko-tag[href="/help/search?phrase=:hidden-tag"] {
      	display:none;
    }
  3. Change hidden-tag with the tag label you wish to hide.
  4. Click Save.

For example, this code will hide the int-category tag from Search Results:

Sample Code: will hide "int-category" tag from Search Results

Note: this will hide the tag from Search Results. It will still appear in the search dropdown list if readers begin their search with the ":" used for tag searches.

Hide tags containing a specific prefix or suffix from Search Results

If you use naming conventions to identify internal rather than external-facing tags, you might want to hide those internal tags from Search Results. If your tags have a consistent naming pattern, we recommend using JavaScript to hide the tags, rather than CSS, since you can write one statement to do partial matches (for example: hide all tags that begin with "internal-").

To use this approach:

  1. Go to Settings > Style.
  2. Click on Custom HTML > Body.
  3. At the bottom of the Body, add this script:
    <script>
    //Hide tags with "sample-" prefix from Search Results
    $(function(){
     $('.ko-tag:contains("sample-")').hide();
    });
    </script>
  4. Change sample- to match the prefix or suffix you use for the group of tags you want hidden.
  5. Click Save.

Note: this will hide the tags from Search Results. They will still appear in the search dropdown list if readers begin their search with the ":" used for tag searches.

This script will hide all tags that have "sample-" anywhere in them from Search Results.

Pro Tip: If you have a group of tags like "productguide", "productlabel", "product", and "byproduct" this logic will hide all four tags. We recommend using dashes or something similar in your prefix/suffixes so that you can try to avoid accidentally hiding tags that contain this word somewhere else.

Ideally, use a prefix that wouldn't show up as part of a legit tag. For example, we use "internal-" as a tag prefix and then hide all internal tags:

Sample Code: will hide all tags with text matching "internal-" from Search Results

Hide all tags and show only specific tags

You can also choose to hide all tags from Search Results by default and show only specific tags. This is great if you're mostly using tags for internal purposes but do have a handful of tags you want to show to your readers (like content designations: "Webinar", "User Guide", etc.) For this option, we'll use CSS to hide all tags from Search Results, and then use JavaScript to override that and display the specific tags we want to see.

  1. Go to Settings > Style. Be sure you are in the Custom CSS section.
  2. Copy and paste this code exactly into your Custom CSS:
    /* Hide all tags from Search Results */
    a.ko-tag {
      display: none;
    }
  3. Go to Custom HTML > Body.
  4. Copy and paste this code into the bottom of the Body editor:
    <script>
    //Show "tagname" tag in Search Results
    $(function(){
     $('.ko-tag:contains("tagname")').css("display", "inline-block");});
    </script>
  5. Change tagname to match the tag you want to appear in Search Results.
  6. For multiple tags, simply copy $('ko-tag:contains("tagname")').show(); and paste it again for each additional tag.
  7. Click Save.

Note: the CSS will hide the rest of the tags from Search Results. All tags will still appear in the search dropdown list if readers begin their search with the ":" used for tag searches.

Here's a sample with several tags:
Sample code to show only Webinar, User Guide, and Troubleshooting tags in Search Results; requires the CSS in Step #2 to work properly.