Skip to main content

How do I customize Category icons? (SAP KC)

This document will provide the steps to take to Customize the Category Icons. Category Icons are the Icons that are present on all Category pages. Learn how to replace our default icons that are present on all Category pages with your own custom icons:



  1. Add your Custom icons to your site's Media Repository.
    • This is not required to do, though as 'Best Practices' for this, MindTouch recommends to add your icons to a Media Repository.
    • Note the URL for the icons you are going to use -- you will need it in the CSS code.
    • To get the URL of the attachment, hover over the attachment and look for the pop-up at the bottom of the page -- see screen-shot.

      Attachments Section.jpg
  2. In the Custom Site CSS, add the code listed below.
    • To get to the Custom Site CSS, you will need to access the Control Panel
      • Site Tools >> Control Panel >> Customize >> Custom Site CSS
  3. Within the CSS code, you will want to add the icon URL noted in step #1.2 -- (ADD_URL_HERE)
  4. Hit the Save button.

Codes to use

#sub-guides-container dt.knowledge-base {
background: url(ADD_URL_HERE) no-repeat;

#sub-guides-container dt.admin-guide {
background: url(ADD_URL_HERE) no-repeat;

#sub-guides-container dt.user-guide {
background: url(ADD_URL_HERE) no-repeat;

#sub-guides-container dt.started-guide {
background: url(ADD_URL_HERE) no-repeat;
  • Was this article helpful?