Optionally provide private feedback to help us improve this article...

Thank you for your feedback!

Adding your own logo to InstantKB

To replace the default InstantKB logo with your own company logo you will need to follow the steps below.

1. Open your InstantKB web.config file. Set the "InstantASP_DebugMode" application setting to "true". This will put InstantKB into debug mode and will allow you to work with the unminified and unbundled CSS.

2. Navigate to your InstantKB installation folder so you can edit the various skin files. Open Skins/{YourSkinName}/Styles/theme-debug.css. Update the following CSS class shown below to link to your preferred logo...

.i-logo {background-image:url(../images/logo.png);} 

3. Save theme-debug.css. Refresh your web browser to test your changes. 

4. Once happy with your changes you should then delete "core.css" and "theme.css" from your Skins/{SkinName}/Styles folder. These files will be automatically generated again by InstantKB whilst InstantKB is within debug mode.  Visit your InstantKB installation again and you should see core.css and theme.css are re-created and now contain your changes you made to the debug files. 

5. Once core.css and theme.css have been re-created from the various debug files you should ensure the InstantASP_DebugMode application setting within your web.config is set to "false" to ensure core.css and theme.css are loaded as opposed to the various debug files. 

That's It!

For further information on how to edit CSS by hand within InstantKB please see Editing CSS by hand within InstantKB. This article explains further how our CSS bundling and minifcation works. If we can assist further with your customization questions please don't hesitate to submit a support request