HelpSite gives you a simple and effective design out-of-the box, with no customization or knowledge of HTML required.
To get started with these features, just signup/login to HelpSite and visit Customize > Layout & HTML.
These features are available during the free trial period, however beyond that they require our Gold plan. See pricing.
We support the following use cases:
- Design the look-and-full of your help site to your liking, to match your company's brand
- Tweaking the styling of your logo to the header or footer
- Drop in your own analytics tracking system code like Google Analytics
- Changing the English snippets to customize text or translate your site into other languages
- Add a live-chat feature like Olark, LiveChat, etc.
- Change the number of articles displayed on the home page per category
- ... and many more!
The templating uses a language called Liquid. Consult the Liquid templating guide for an idea of what's possible, or contact us if you need help or want to see examples of how people have customized HelpSite-hosted knowledge base sites.
The customization feature described above can be used to completely redesign the entire look-and-feel of a HelpSite, or it can be used to simply tweak a single thing, such as a font, color, etc.
To override our existing CSS, you would just add a
<style> tag in the
<head> of the Main Layout.
A simple example of just changing the color of links would look like this:
If your CSS doesn't seem to be taking effect, keep the rules of CSS specificity. You can override styles by adding
!important, or you can do so without
!important as long as you use an equally or higher level of specificity in your selector and apply your styles after our default styles. You can do that either via an inline style="..." attribute, with a
<style> tag in the head as shown above, or link an outside hosted CSS file (via
<link rel="stylesheet" type="text/css" href="https://example.com/helpsite.css">)
You can use the Google Chrome Inspector or similar tools to inspect our default styles and to find specific CSS class selectors that you may want to extend.