Getting Started with a Custom HTML Template
We use Handlebars to give our HTML templates superpowers. Handlebars lets you do things like loop through arrays of tags and authors, and output HTML for each. It also lets you register and reuse partials which cleans up your HTML no end.
If you're not familiar with Handlebars you should check out the official documentation. HelpDocs templates are compatible with all the syntax of Handlebars v3, with the addition of Inline Partials from Handlebars v4.
We also support a number of helpers for Handlebars. We've built these helpers in-house to make common tasks like internationalization easier. You can read more about our helpers here.
Enabling Custom HTML Templates
You can enable custom HTML templates in Settings > Brand. Choose Custom from the Template dropdown.
Once you've enabled custom templates you'll get a new tab in Settings called Templates. This is where you'll manage the HTML and Handlebars for each partial of your knowledge base.
Since you only have to provide the content for each page, not the whole HTML (include
<link>s, etc.), we call each section you can edit a partial. There's 7 total partials, 6 of which you can edit. Here's a breakdown of what you'll find in Settings > Templates.
You should add your header bar and navigation in here. This appears on every page of your knowledge base. Depending on how you wanna structure your theme, this might also be the right place for your search bar and maybe some secondary navigation like a sidebar. If you need to register inline partials for use in all templates, here's a good place to do that too.
This gets added after your main content (e.g. after the category or article that's being displayed). You can use this to mirror the footer on your main website, or add any scripts to your site that you want before the closing
The entry point of your knowledge base. This is where you display all your categories, so users can easily navigate to a category or article.
Display a single category and all its articles.
Display a single article.
Display search results. Custom templates ship with instant search as standard, but this page is shown when someone hits return in the search bar regardless.
Context Data by Partial
We pass through context data you can use in the templates. This differs slightly on each partial so you only have the information that's actually relevant to that page. Data can be accessed using Handlebars data accessors, e.g.
Available in Partial(s)
The full article object is available in article.hbs. In other partials, some fields (notably
"My super awesome search term"
meta is available on all partials, but some of its attributes may not be available on some partials. Notably top_articles is only available in categories.hbs and related_articles is only available in article.hbs
It's not always fun, desirable, or time-sensible (totally a phrase now 😹) to create a template totally from scratch. Here's a few of our default layouts you can start with. They're in .zip files, so just unzip, and follow the instructions in Readme.md.